模板制作新手教程（八）-制作搜索结果页面

这一篇我们来制作搜索结果页面，rpcms搜索页面模板名称是：search.php，

老样子，先建一个search.php的模板文件。先看看效果图：

一、加入form表单

修改header.php文件，加入form表单。搜索提交的地址为/search，get或post都可以。提交参数名称为q。

<form action="/search/" method="get" class="searchform">
	<input class="input" placeholder="想搜点什么呢.."  name="q" type="text" value="{:input('q')}">
	<button type="submit" class="searchBtn">搜</button>
</form>

二、创建模板

搜索结果的数据列表和列表页的一样，可以参考《帮助文档-模板开发-列表变量》。

这里就简单的实现了下，在search.php中写入：

<?php if (!defined('CMSPATH')){exit('error!');}?>
{include:header}
<div class="container">
	<ul class="logList">
		{foreach $logList as $k=>$v}
		<li><a href="{$v['url']}" title="{$v['title']}">
			{:thumb($v)}
			<div class="info">
				<h3>{$v['title']|str_replace=$listId,'<font style="color: #f40;">'.$listId.'</font>',###}</h3>
				<p class="desc">{$v['excerpt']|str_replace=$listId,'<font style="color: #f40;">'.$listId.'</font>',###}</p>
				<div class="bottom">
					<span>时间：{$v['createTime']}</span>
				</div>
			</div>
		</a></li>
		{/foreach}
	</ul>
	
</div>
{include:footer}

系统自带有搜索功能，默认在标题和内容中检索。

搜索结果数据不包含html内容，所有搜索关键词高亮需要在模板中定义，如上demo中，title和excerpt用了str_replace函数来替换搜索关键词。

三、附CSS，可参考

.searchform{float: right;margin: 10px 20px;}
.searchform input[type="text"]{height: 30px;padding: 0 10px;border: none;border-radius: 3px 0 0 3px;outline:none;float: left;}
.searchform .searchBtn{height: 30px;padding: 0 10px;border: none;float: left;border-radius: 0 3px 3px 0;background: #eaeaea;cursor: pointer;color: #8c8c8c;}
.logList li{margin: 20px 0;}
.logList li:after{content:"";display:block;height:0;clear:both;}
.logList li a{color: #333;}
.logList li img{width: 180px;height: 180px;float: left;margin-right: 20px;}
.logList li .info h3,.logList li .info h3 font{font-size: 20px;}
.logList li .info .desc{height: 100px;margin: 10px 0;color: #999;}
.logList li .info .bottom span{font-size: 13px;color: #999;}

总结：默认在标题和内容中检索，提交地址为/search，参数名称为q，支持get和post。