Help Center - Change default placeholder text in your Search Box

69 コメント

  • Jessie Schutz
    Zendesk Customer Care

    Thanks for sharing, Iggy!

  • William Grote

    The Placeholder option was a snap!  Just searched for the placeholder on the home page and change the text after the placeholder =' to anything you want...'}}


    {{search submit=false instant=true class='search search-full' placeholder='Search Box – I’m wicked smart, please ask me anything...'}}

  • Brett Bowser
    Zendesk Community Manager

    Glad to hear Wes' solution worked for you above William :)

  • Tahmid Mozaffar

    How can I use dynamic content as placeholder in search bar?

    I know this is not valid, I want to do something like this. so that I can show dynamic content in search bar.

    {{search placeholder={{dc 'search_text'}} submit=false instant=settings.instant_search class='search search-full'}}

    Here, search_text is the name of key I added in the dynamic content section of zendesk support.

  • Dan Ross
    Community Moderator

    Hey @...

    I would expect the Dynamic Content to work correctly in that instance but if it doesn't render, you can also use the locale helper to have conditional messages in your template


    {{#is help_center.locale '$locale'}} {{search submit=false instant=true class='search search-full' placeholder='What are you searching for?'}}{{/is}}

    {{#is help_center.locale '$locale2'}} {{search submit=false instant=true class='search search-full' placeholder='Another search string'}}{{/is}}

    where the $locale is the ISO language code of your HC (ex: 'en-us', 'fr', 'nl', 'de')

  • Tahmid Mozaffar

    Hi, thank you for the reply. your approach is working. But in that way I have to put strings in the template code. However I wanted to show dynamic content value that I have added in the Dynamic Content section in Zendesk support admin.

    I was able to do it like below. It is kind of hack, but served my purpose.

    in the home_page.hbs

    {{search placeholder='Search' submit=false instant=settings.instant_search class='search search-full home-page-search'}}

    at the bottom of the file I have added...

    <script src=""></script>
    const searchPlaceHolder = "{{dc 'search'}}";
    $(".home-page-search > input#query")[0].placeholder = searchPlaceHolder;

    here 'search' is the key of the dynamic content I have added in support admin
  • Greg Katechis
    Zendesk Developer Advocacy

    Hi Ivy Gilbert! Both of these options are still valid, so could you share what you have added to your home page template and a screenshot of the search bar placeholder so that we can see what's going on in your situation?

  • Derek Young


    We're using the Copenhagen theme, and I'm not finding either spot to change the Search Box placeholder text.

    Home: {{search submit=false instant=true class='search search-full'}}
    JS: $(document).ready(function() {

    Has the location or code changed for this?

  • Jupete Manitas
    Zendesk Customer Care
    Hi Derek, thanks for writing in! 
    We can find the Search bar code under home_page.hbs template and you can add them after the search-full'. We followed ModeratorWes' tip and so far it is working on our end. 


    We hope this information helps!


Powered by Zendesk