WordPress自定义searchform.php

WordPress自定义searchform.php

第一步:检查WordPress主题是否含有searchform.php文件,如果没有则在主题根目录下新建searchform.php,然后再里面添加如下代码:

<form class="searchForm" role="search" method="get" action="<?php echo home_url('/'); ?>">
  <input class="form-control" type="search" name="s" value="<?php if (is_search()) { echo get_search_query(); } ?>" placeholder="<?php _e('搜索……', 'lerm');?>">
</form>

第二步:在需要搜索表单的地方添加如下代码:

<div class="collapse" id="search">
  <?php get_search_form(); ?>
</div>

第三步:在style.css中自定义表单样式:

 #search {
     position: relative;
 }
 .searchForm {
     position: absolute;
     z-index: 999;
     right: 0;
 }

完成以上步骤就可以完成搜索表单的自定义,在搜索框中输入内容后点击回车即可完成搜索,效果见本站搜索表单

本站使用bootstrap框架,如有问题或者好的建议请在下方评论留言讨论

发表评论