5

I wanted to change my search form a bit by adding autocomplete="off" to the search input.

I initially looked for a simple filter like the following:

//* 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...' );
}

But because the /genesis/lib/structure/search.php did not have any variable like autocomplete="%s", that attribute could not be targeted. I probably had to introduce it directly, so I copied the search.php from the parent theme folder to the child theme folder folder.

The original code of the file was the following:

<?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' ) . ' &#x02026;' );

    $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 );

}

Then I removed the original filter and added my filter:

remove_filter( 'get_search_form', 'genesis_search_form' );

add_filter( 'get_search_form', 'my_search_form' );

And added autocomplete="off" to the search input, so the current is:

<?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' ) . ' &#x02026;' );

    $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 );

}

It currently works perfectly on the homepage, but in any other page only the header and the tagline are generated.


Update

I've done some testing and found the source of the issue where the pages were not generated, it was having this in functions.php, retrieved from this site:

//* Add the search bar
add_filter( 'wp_nav_menu_items', 'sp_menu_items', 10, 2 );
function sp_menu_items( $items, $args ) {

    $items .= sprintf( '<li id="sb" class="menu-item sb">%s</li>', get_search_form( false ) );
    return $items;

}

and having the current code I was testing in the searchform.php, retrieved from this site

<?php

add_filter( 'genesis_search_form', 'my_search_form', 10, 1);
function my_search_form( $form ) {

$search_text = get_search_query() ? apply_filters( 'the_search_query', get_search_query() ) : apply_filters( 'genesis_search_text', __( 'Search this website', 'genesis' ) . ' &#x02026;' );

$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';

$form = sprintf(
            '<form class="search-form"><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" placeholder="%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 ),
            esc_attr( $search_text ),
            esc_attr( $button_text )
        );

return $form;

}

Removing any or using both in functions.php will result in all pages displaying correctly. Any idea why?


Documentation for get_search_form

Documentation for genesis_search_form

Documentation for Genesis Snippets

  • 1
    Where is your my_search_form() function you use in the add_filter()? And what kind of errors? – Max Yudin Mar 8 '17 at 14:24
  • In the searchform.php I remove the original genesis_search_form() filter and replace all instances of genesis_search_form() with my_search_form() and add the autocomplete="off" to the code. The errors are error 500 where the entire or parts of the page appear white, it seems that the code can't run properly outside of its original location, but I wanted an alternative to avoid editing the parent theme framework directly. – SilverLink Mar 8 '17 at 15:40
5
+50

I'm not sure why you're getting a 500 error. Likely because you're trying to use a function before it's been defined.

But I think you're going about the problem the wrong way. Genesis does provide a filter before returning the search form. Why not just add a filter to the genesis_search_form hook?

You can add the filter to your child theme functions.php file:

add_filter( 'genesis_search_form', function( $form, $search_text, $button_text, $label ) { 
  return str_replace( 
    'type="search"', 
    'type="search" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="off" dir="auto"', 
    $form 
  );
}, 10, 4 );

Alternate (untested, but it should work) method using substr_replace():

add_filter( 'genesis_search_form', function( $form, $search_text, $button_text, $label ) { 
  $insert = ' autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="off" dir="auto"';
  $needle = 'type="search"';
  $where = strpos( $form, $needle ) + strlen( $needle );
  return substr_replace( $form, $insert, $where, 0 );
}, 10, 4 );

You're getting a 500 error because you can't have a function as an argument in sprintf(). Try this:

//* Add the search bar
add_filter( 'wp_nav_menu_items', 'sp_menu_items', 10, 2 );
function sp_menu_items( $items, $args ) {
    $form = get_search_form( false );
    $items .= sprintf( '<li id="sb" class="menu-item sb">%s</li>', $form );
    return $items;

}
  • 1
    I have an edit in the que. This didn't work so it was corrected as follows: add_filter( 'genesis_search_form', function( $form ) { return str_replace( 'type="search"', 'type="search" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="off" dir="auto"', $form ); }, 10, 4); – Christina Mar 11 '17 at 19:48
  • @Christina, Nathan - That looks very neat and simple, it's the best solution so far. I found the source of the initial conflict, would you mind looking at it, please? – SilverLink Mar 11 '17 at 20:29
  • The second code has the same effect of not generating the bottom of the pages that are not homepage. the most awkward thing is that if both the of codes of adding and modifying are in the functions.php it displays fine. I added the sites where I based my codes. – SilverLink Mar 11 '17 at 21:14
  • That code should be in your functions.php file not searchform.php. See here. searchform.php is for styling the form. – Nathan Johnson Mar 11 '17 at 21:19
  • Alright, thank you! One last comment before resolving this. Before I did not have printf, I added it to test, I had ' . get_search_form( false ) . ' would that be better? And the first code is really neat, but in str_replace isn't there a way to insert instead of replacing? and that is all, thank you very much. – SilverLink Mar 11 '17 at 21:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.