If you’re using the Hostinger Website Builder and want to improve your website’s user experience, adding a search bar is one of the best features you can implement. In this tutorial, we’ll show you how to embed a functional search engine that searches only your site’s content—powered by Google’s Programmable Search Engine.
Step 1: Log Into Hostinger and Open Your Website
Start by logging into your Hostinger account. Navigate to the Websites section, and click Edit Website next to the site you want to modify.
Step 2: Create a Google Programmable Search Engine
Open a new browser tab and search for Google Programmable Search Engine. Click Get Started, then Add or Create Your First Search Engine.
- Name your search engine (e.g., Ben Tutorial)
- Choose to search only specific sites
- Enter your full site URL, or individual page URLs
- Enable image search or SafeSearch if needed
- Click Create
Step 3: Customize the Search Engine Layout
Go to Look and Feel settings and choose between Overlay or Full Width layout. Full Width is recommended to avoid compatibility issues with Hostinger’s builder.
Step 4: Embed the Code into Hostinger
Back in Hostinger:
- Click Add Element
- Scroll to Embed Code, then drag and drop it into your layout
- Paste the code provided by Google
- Add a title like “Search This Website” above the bar
- Click Update and Preview the site
Step 5: Test Your Search Engine
Make a test search using a keyword from one of your blog posts or pages. Keep in mind that the results depend on what Google has already indexed from your site. If a page isn’t indexed yet, it won’t show up in results.
Bonus: Why It May Not Show Results
If the search engine isn’t returning expected results, try this:
- Visit Google and search
site:yourdomain.comto see what’s indexed - Make sure the pages you want searchable are live and indexed