Change storefront search field placeholder

  • Resolved webdevtestus

    (@webdevtestus)


    5 years, 8 months ago

    Hi, and thanks in advance.
    NOTE: NSFW site, maybe some hot images from eBooks covers, no nude but adult romance covers.

    Great.

    I have storefront+bookshop child theme, I want to change the placeholder “Search products…”within search field (#woocommerce-product-search-field-0). No matter what I try, it seems not to affect placeholder.
    I could change search width, alignment, text and border color BUT not placeholder…
    here the code so far

    /*Align Search Bar and make text and border pink #fe00a1*/
    #woocommerce-product-search-field-0 {
    display:inline-block;
    width:100%;
    color: #fe00a1;
    border: solid 1px #fe00a1;
    }

    I also tried several PHP snippets, the best one that allowed me to change almost any text within woocomemrce is this GETTEXT filter from getText filter.

    function my_text_strings( $translated_text, $text, $domain ) {
    switch ( $translated_text ) {
    case ‘Search products…’ :
    $translated_text = __( ‘Search for contemporary romance books, series ot authors…’, ‘woocommerce’ );
    break;
    }
    return $translated_text;
    }
    add_filter( ‘gettext’, ‘my_text_strings’, 20, 3 );

    but..yes, you guessed, it didn′t work.

    How can I replace the locked, hidden, or whatever has “Search prodcuts” with “Search for contemporary romance books, series ot authors…”?? CSS, PHP, harcde HTML itself, some tip?

    Thanks in advance.

    webdevtestus

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Job a11n

    (@jobthomas)

    Automattic Happiness Engineer

    Hey @webdevtestus – the problem with that is that the comma after books is confusing your code. If you replace it with & #044; which is the HTML to write a comma, you’ll see that it works as expected.

    I’ve gone for a slightly simpler approach and followed this tutorial by Business Bloomer to get this code (and it’s working):

    add_filter( 'gettext', 'my_text_strings', 20, 3);

function my_text_strings( $translated, $text, $domain ) {
  $translated = str_ireplace( 'Search products', 'Search for contemporary books& #044; series or authors', $translated );
  return $translated;
}

    Edit: when I try to add way of writing a comma, it converts the already. ?? So I’m editing it and adding a space in there. – so you’ll want to remove the space between & and #044.

    • This reply was modified 5 years, 8 months ago by Job a11n.
    • This reply was modified 5 years, 8 months ago by Job a11n.
    • This reply was modified 5 years, 8 months ago by Job a11n.
    Thread Starter webdevtestus

    (@webdevtestus)

    Hey, Job! sorry the delay and thanks a lot!!!

    it works as expected! you saved my day.! great, I am really thankful.

    I was turning around this with no result and you solved in no time, you are awesome!!

    Kind regards

    webdevtestus

    Thread Starter webdevtestus

    (@webdevtestus)

    Thanks..it worked!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Change storefront search field placeholder’ is closed to new replies.

Tags