How to Customize the Search Bar Placeholder Text in Your Docs Site HelpSpace

Customizing the placeholder text in the search bar of your Docs site can help personalize your website and make it more user-friendly. This guide will walk you through the simple steps to change the default placeholder text to something of your preference.

Step 1: Access Site Settings

Go to your Docs site.
Select the "Settings" of your Docs site.

Step 2: Navigate to Advanced Styling

In the settings menu, scroll down until you find "Site Styling."
Within the "Site Styling" section, look for "Advanced Styling" and click on it.

Step 3: Customize the Placeholder Text

Enter the following script into the text area field "Insert between <head></head>":

<script>
  window.addEventListener('load', function () {
    const customSearchPlaceholder = 'Type in the placeholder text you prefer.';
    document.getElementsByName('Search')[0].placeholder = customSearchPlaceholder;
  });
</script>

Replace "Type in the placeholder text you prefer" with the text you'd like to appear as the new placeholder text for the search bar.

Step 4: Save Your Changes

After making the desired changes to the script, click the "Save" button.