Home >Web Front-end >HTML Tutorial >SharePoint 2013 定制搜索显示模板(二)_html/css_WEB-ITnose
之前一篇博客,简单的介绍了如何定制搜索显示模板,这一次,我们介绍一下如何定制搜索显示时,弹出来的那个页面,相信这个大家也都会遇到的。
1、第一部分就是搜索显示模板的部分,第二部分就是搜索项目详情的部分,如下图:
2、按照之前一篇博客介绍的过程,找到下面红框的html,下载一份副本到本地修改,如下图:
3、改个名字上传回去,之后也会自动生成一个JavaScript文件,具体信息对比一下,不要选择错了(一般默认就是对的,如果有问题了记得校对一下),如下图:
4、首先修改一下上一篇介绍的显示模板定义,里面有关联的详细信息模板定义,如下图:
注:可能有人会问,我们下载的副本是html的,为嘛关联一个js的呢?!这个我在做的时候也有点疑惑,不过JavaScript会在上传html模板的时候自动生成,也就不迷惑了;
5、尝试在spd里修改详情显示模板,加一个标题带上样式测试一下,如下图:
6、测试结果,说明我们改的地方是对的,虽然很少这么改,如下图:
7、简单介绍一下搜索详细显示模板的结构,主要是Header、Body、Footer三个部分,具体每个部分是干什么的,相信大家一看便知,如下图:
8、我们尝试在中间的缩略图(画外音:什么缩略图,明明就是一个iframe在模板里,你当我傻啊!确实是这样的,呵呵)后面,加上一个描述字段,算是一个“大改”吧,看看情况,如下图:
9、可以看到我们的描述字段,显示在了我们想要让他出现的地方,里面的内容也是我们想要显示的内容,如下图:
注:修改任何搜索项目的属性,都要爬网才生效,别傻傻的修改了属性,怎么改模板都不管用。。你不增量爬网一下,搜索项目属性的修改是不生效的。
以上,便是搜索详细显示模板的定义,其实很简单,只要找对了需要修改的位置,修改起来非常容易的。其实一开始我也这么认为的,但是如果你想大概,还是需要花费一番心思的,比如修改Footer里面的操作,好吧。。休息。。休息一下。。