wordpress主题大全(WP主题开发16:wordpress主题trans,搜索页模板如何创建?)

wufei123 发布于 2024-03-04 阅读(21)

在wordpress主题的动态模板中,搜索页模板并不是必须的但是,为了对用户更加的友好,可以让用户在wordpress网站上能够通过搜索来查找自己的想要的文章内容,我们还是有必要给trans主题添加一个搜索页模板。

一般情况下,wordpress主题动态模板的搜索页的整体布局和文章列表页模板是差不多的,所以,我们可以参照文章列表页来做第一步:创建一个search.php文件在wordpress主题trans目录下创建一个search.php文件,这是wordpress程序要求的默认搜索页模板的文件,名字必须是search。

然后,把trans静态模板search.html文件中的代码全部复制到search.php文件中第二步:修改头部的代码在search.php文件中,删除从到标签之间的所有代码。

然后,在同样的位置,通过wordpress函数来引入公共的头部模板文件:修改头部模板header.php文件中的搜索表单的代码,代码如下:

< form action="" method="get">

注:第一个input输入框的name值必须是 s (如上图),这也是wordpress的硬性要求否则,就搜索不到任何内容第三步:修改search.php的侧边栏代码在search.php文件中,删除标签所包含的所有侧边栏代码,然后,在这个位置上,引入sidebar.php侧边栏公共模板:。

第四步:修改搜索页模板的底部代码在搜索页模板中,删除从标签到模板代码结束的所有底部代码,然后,在当前的位置上,添加如下代码引入底部公共模板:。

第五步:修改search.php的左侧主体部分的面包屑导航因为是搜索页面模板,所以,这个面包屑导航,我们要体现出搜索结果所以,我们删除search.php模板中标签内部的所有代码,替换成如下的代码:。

搜索< a href="">首页 > 搜索结果 关键词“”共有 found_posts; ?> 个搜索结果

上面代码解说:the_search_query():输出要搜索的关键词;$wp_query:是wordpress提供的一个全局变量,它包含当前页面的所有查询数据;$wp_query->found_posts:搜索当前关键词的数量

搜索页面包屑导航效果如下图:

第六步:修改搜索页模板左侧的文章列表删除search.php搜索页模板中标签内部的所有代码,然后,替换成如下代码:< a href="">< a href=""> trim(strip_tags( $post->post_title )), title => trim(strip_tags( $post->post_title )))); }else { //否则调用文章第一张图片echo post_title." width="150" height="150" />;}?>post_content),0,120,utf-8); ?> ... ID, views, true); ?> 。

这段代码,我们在archive.php文章列表页模板中我们已经介绍过了,就不多说了第七步:添加分页代码在trans静态模板的代码中,我们没有分布代码,这里,我们添加上搜索结果的分页效果代码:。

3, //当前页码数的 两边 显示几个页码prev_text =>>, //下一南) );?>。

这里,我们使用到了wordpress提供的分页函数the_posts_pagination()来实现搜索页的文章列表的分页效果这个函数我们在修改首页模板时,我们就介绍过了,如果想了解它,可以回到我们创建首页模板index.php的文章去看看。

​好了,通过以上几步,我们就完成了wordpress主题动态模板trans的搜索页面模板的创建和修改此时,我们在头部搜索框中输入关键词进行搜索后,搜索结果如上图所示从这几节课,我们可以看出,有了公共模板后,我们创建其它动态模板时,就方便多了,只要按照本节的几个步骤,就可以很轻松地创建出wordpress主题的动态模板文件。

如果喜欢我的文章,别忘了帮我“点赞、评论和关注我”哦

亲爱的读者们,感谢您花时间阅读本文。如果您对本文有任何疑问或建议,请随时联系我。我非常乐意与您交流。

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

宝骏汽车 新闻50661