目录
get_search_form( bool $echo = true )
显示搜索框。
介绍
默认会调用 searchform.php 文件,如果主题中没有这个文件,会使用 wp-includes/general-template.php 中的 get_search_form 函数。
使用
get_search_form( $echo );
默认会自动输出。
示例
主题搜索框
在你的主题目录中新建一个php文件 searchform.php,插入:
<form action="/" method="get">
<label for="search">Search in <?php echo home_url( '/' ); ?></label>
<input type="text" name="s" id="search" value="<?php the_search_query(); ?>" />
<input type="image" alt="Search" src="<?php bloginfo( 'template_url' ); ?>/images/search.png" />
</form>
之后就可以在主题的文件中,使用
<?php get_search_form();?>
来调用搜索功能。
显示一个HTML5标签的搜索框
WordPress 3.6开始,只是html 5标签了,以下代码加入 functions.php 文件中。
/**
* Add HTML5 theme support.
*/
function wpdocs_after_setup_theme() {
add_theme_support( 'html5', array( 'search-form' ) );
}
add_action( 'after_setup_theme', 'wpdocs_after_setup_theme' );
构建搜索函数:
<form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
<label>
<span class="screen-reader-text"><?php echo _x( 'Search for:', 'label' ) ?></span>
<input type="search" class="search-field"
placeholder="<?php echo esc_attr_x( 'Search …', 'placeholder' ) ?>"
value="<?php echo get_search_query() ?>" name="s"
title="<?php echo esc_attr_x( 'Search for:', 'label' ) ?>" />
</label>
<input type="submit" class="search-submit"
value="<?php echo esc_attr_x( 'Search', 'submit button' ) ?>" />
</form>
这里看到了吗,input 支持了 type=”search” 属性了。
构建一个HTML 4的搜索框
可以将一下代码放入你的主题模板中。
<form role="search" method="get" id="searchform"
class="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<div>
<label class="screen-reader-text" for="s"><?php _x( 'Search for:', 'label' ); ?></label>
<input type="text" value="<?php echo get_search_query(); ?>" name="s" id="s" />
<input type="submit" id="searchsubmit"
value="<?php echo esc_attr_x( 'Search', 'submit button' ); ?>" />
</div>
</form>
THE END
暂无评论内容