我想通过将autocomplete="off"
添加到搜索输入中来稍微更改搜索形式。
我最初寻找的是一个简单的过滤器,如下所示:
//* Customize search form input box text
add_filter( 'genesis_search_text', 'sp_search_text' );
function sp_search_text( $text ) {
return esc_attr( 'Search my blog...' );
}
但是因为
/genesis/lib/structure/search.php
没有像autocomplete="%s"
这样的任何变量,所以无法将该属性作为目标。我可能必须直接对其进行介绍,因此我将search.php
从父主题文件夹复制到了子主题文件夹文件夹。该文件的原始代码如下:
<?php
/**
* Replace the default search form with a Genesis-specific form.
*
* The exact output depends on whether the child theme supports HTML5 or not.
*
* Applies the `genesis_search_text`, `genesis_search_button_text`, `genesis_search_form_label` and
* `genesis_search_form` filters.
*
* @since 0.2.0
*
* @return string HTML markup for search form.
*/
add_filter( 'get_search_form', 'genesis_search_form' );
function genesis_search_form() {
$search_text = get_search_query() ? apply_filters( 'the_search_query', get_search_query() ) : apply_filters( 'genesis_search_text', __( 'Search this website', 'genesis' ) . ' …' );
$button_text = apply_filters( 'genesis_search_button_text', esc_attr__( 'Search', 'genesis' ) );
$onfocus = "if ('" . esc_js( $search_text ) . "' === this.value) {this.value = '';}";
$onblur = "if ('' === this.value) {this.value = '" . esc_js( $search_text ) . "';}";
// Empty label, by default. Filterable.
$label = apply_filters( 'genesis_search_form_label', '' );
$value_or_placeholder = ( get_search_query() == '' ) ? 'placeholder' : 'value';
if ( genesis_html5() ) {
$form = sprintf( '<form %s>', genesis_attr( 'search-form' ) );
if ( genesis_a11y( 'search-form' ) ) {
if ( '' == $label ) {
$label = apply_filters( 'genesis_search_text', __( 'Search this website', 'genesis' ) );
}
$form_id = uniqid( 'searchform-' );
$form .= sprintf(
'<meta itemprop="target" content="%s"/><label class="search-form-label screen-reader-text" for="%s">%s</label><input itemprop="query-input" type="search" name="s" id="%s" %s="%s" /><input type="submit" value="%s" /></form>',
home_url( '/?s={s}' ),
esc_attr( $form_id ),
esc_html( $label ),
esc_attr( $form_id ),
$value_or_placeholder,
esc_attr( $search_text ),
esc_attr( $button_text )
);
} else {
$form .= sprintf(
'%s<meta itemprop="target" content="%s"/><input itemprop="query-input" type="search" name="s" %s="%s" /><input type="submit" value="%s" /></form>',
esc_html( $label ),
home_url( '/?s={s}' ),
$value_or_placeholder,
esc_attr( $search_text ),
esc_attr( $button_text )
);
}
} else {
$form = sprintf(
'<form method="get" class="searchform search-form" action="%s" role="search" >%s<input type="text" value="%s" name="s" class="s search-input" onfocus="%s" onblur="%s" /><input type="submit" class="searchsubmit search-submit" value="%s" /></form>',
home_url( '/' ),
esc_html( $label ),
esc_attr( $search_text ),
esc_attr( $onfocus ),
esc_attr( $onblur ),
esc_attr( $button_text )
);
}
return apply_filters( 'genesis_search_form', $form, $search_text, $button_text, $label );
}
然后,我删除了原始过滤器并添加了我的过滤器:
remove_filter( 'get_search_form', 'genesis_search_form' );
add_filter( 'get_search_form', 'my_search_form' );
并将
autocomplete="off"
添加到搜索输入中,因此当前为:<?php
/**
* Replace the default search form with a Genesis-specific form.
*
* The exact output depends on whether the child theme supports HTML5 or not.
*
* Applies the `genesis_search_text`, `genesis_search_button_text`, `genesis_search_form_label` and
* `genesis_search_form` filters.
*
* @since 0.2.0
*
* @return string HTML markup for search form.
*/
remove_filter( 'get_search_form', 'genesis_search_form' );
add_filter( 'get_search_form', 'my_search_form' );
function my_search_form() {
$search_text = get_search_query() ? apply_filters( 'the_search_query', get_search_query() ) : apply_filters( 'genesis_search_text', __( 'Search this website', 'genesis' ) . ' …' );
$button_text = apply_filters( 'genesis_search_button_text', esc_attr__( 'Search', 'genesis' ) );
$onfocus = "if ('" . esc_js( $search_text ) . "' === this.value) {this.value = '';}";
$onblur = "if ('' === this.value) {this.value = '" . esc_js( $search_text ) . "';}";
// Empty label, by default. Filterable.
$label = apply_filters( 'genesis_search_form_label', '' );
$value_or_placeholder = ( get_search_query() == '' ) ? 'placeholder' : 'value';
if ( genesis_html5() ) {
$form = sprintf( '<form %s>', genesis_attr( 'search-form' ) );
if ( genesis_a11y( 'search-form' ) ) {
if ( '' == $label ) {
$label = apply_filters( 'genesis_search_text', __( 'Search this website', 'genesis' ) );
}
$form_id = uniqid( 'searchform-' );
$form .= sprintf(
'<meta itemprop="target" content="%s"/><label class="search-form-label screen-reader-text" for="%s">%s</label><input itemprop="query-input" type="search" name="s" id="%s" %s="%s" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="off" dir="auto" /><input type="submit" value="%s" /></form>',
home_url( '/?s={s}' ),
esc_attr( $form_id ),
esc_html( $label ),
esc_attr( $form_id ),
$value_or_placeholder,
esc_attr( $search_text ),
esc_attr( $button_text )
);
} else {
$form .= sprintf(
'%s<meta itemprop="target" content="%s"/><input itemprop="query-input" type="search" name="s" %s="%s" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="off" dir="auto" /><input type="submit" value="%s" /></form>',
esc_html( $label ),
home_url( '/?s={s}' ),
$value_or_placeholder,
esc_attr( $search_text ),
esc_attr( $button_text )
);
}
} else {
$form = sprintf(
'<form method="get" class="searchform search-form" action="%s" role="search" >%s<input type="text" value="%s" name="s" class="s search-input" onfocus="%s" onblur="%s" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="off" dir="auto" /><input type="submit" class="searchsubmit search-submit" value="%s" /></form>',
home_url( '/' ),
esc_html( $label ),
esc_attr( $search_text ),
esc_attr( $onfocus ),
esc_attr( $onblur ),
esc_attr( $button_text )
);
}
return apply_filters( 'my_search_form', $form, $search_text, $button_text, $label );
}
当前,它可以完美地在首页上运行,但在其他任何页面上,仅会生成标题和标语。我可以直接编辑父主题文件,但是想要一个替代方案以避免困惑所有内容。有什么见解或建议吗?
Documentation for get_search_form
Documentation for genesis_search_form
Documentation for Genesis Snippets
最佳答案
我看到genesis_search_form
函数在最后应用了genesis_search_form
过滤器。无需重写整个genesis_search_form
函数,您可以使用它来操纵表单并在新过滤器中使用DOMDocument
来添加所需的autocomplete
属性。在您的子主题functions.php
中尝试以下代码,看看是否可行:
add_filter( 'genesis_search_form', 'my_search_form_filter', 5 );
function my_search_form_filter($form) {
$document = new DOMDocument();
$document->loadHTML($form);
$xpath = new DOMXPath($document);
$input = $xpath->query('//input[@name="s"]');
if ($input->length > 0) {
$input->item(0)->setAttribute('autocomplete', 'off');
}
# remove <!DOCTYPE
$document->removeChild($document->doctype);
# remove <html><body></body></html>
$document->replaceChild($document->firstChild->firstChild->firstChild, $document->firstChild);
$form_html = $document->saveHTML();
return $form_html;
}
不要忘记禁用您的代码,该代码将禁用默认的
get_search_form
过滤器并添加您的代码。编辑
先前的代码有误,请使用上面可用的最新代码进行更新。我已经使用
genesis
和genesis-child
主题对其进行了测试。在这里,您可以找到安装了
genesis
主题的Dev Wordpress网站,并且可以检查搜索输入框,并看到其autocomplete
属性设置为off
:http://wp.dev.lytrax.net/这是显示具有
autocomplete
属性的表单搜索输入元素的屏幕截图:编辑2
genesis-sample
主题使用HTML5搜索表单,并且在meta
元素可以使用createDocumentFragment
处理的代码中包含一些appendXML
标记,因此它引发许多警告,并且无法继续。您看不到那些PHP警告,因为您很可能已禁用它们。请尝试我更新的代码。将其添加到genesis-sample/functions.php
文件的末尾,并检查是否添加了autocomplete
属性。