主页 > 技术中心 > wordpress技术 > the7技术 >
修改wordpress the7显示自定义输入搜索框,不再点击才会弹出
日期:2018-10-09 09:26 浏览量:
默认的wordpress主题是需要点击才会弹出输入搜索框,今天给大家介绍个文件默认就可以显示输入搜索框,然后就可以自己自定义样式了。

首先要找到搜索文件: searchform.php, 位置:dt-the7\templates\header\searchform.php

搜索表单代码:

<form class="searchform" role="search" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label for="search" class="screen-reader-text"><?php esc_html_e('Search:', 'the7mk2'); ?></label>
<input type="text" class="field searchform-s" name="s" value="<?php echo esc_attr( get_search_query() ); ?>" placeholder="<?php _e( 'Type and hit enter &hellip;', 'the7mk2' ); ?>" />
<?php do_action( 'presscore_header_searchform_fields' ); ?>
<input type="submit" class="assistive-text searchsubmit" value="<?php esc_attr_e( 'Go!', 'the7mk2' ); ?>" />
<a href="#go" id="trigger-overlay" class="submit<?php echo $class; ?>"><?php echo esc_html($caption); ?></a>
</form>

红色内容解析,也就是我们要操作的内容:

field 
这个是JS判断输入搜索框隐藏的标签,去掉后输入搜索框就会显示了,也可以加入其它你自定义css名控制修改后的搜索框样式;

<a href="#go" id="trigger-overlay" class="submit<?php echo $class; ?>"><?php echo esc_html($caption); ?></a>
这个就是the7那个点击弹出输入搜索框的 图标+文字 样式,去掉就没有了。

  • 用户评价
共有人阅读,0人评价,期待你的评论!
验证码: 点击我更换图片
最新评论
返回顶部
18122056230周一至周六9:00-21:00联系在线客服
优惠套餐 联系我们