[Solution] How to add the Google search box to a website in 5 steps

  • Post category:Web Tech

The in-built search utility of almost all CMS software, e.g., WordPress, Vanilla, PHPBB, etc., comes with only basic features. It does not support searching using various combinations of keywords. Sometimes, some keywords will return no page even if you have some web pages with those keywords. So, using CMS’s search function is not a good idea. Luckily, this problem has a very nice solution. You can add the Google search box to your website, and once google indexes your webpages, you can use any combination of keywords to search pages on your website. Adding a google search bar to a website is very simple and easy. In this post, I will show you the steps you need to follow to get the javascript code for the google search box.

Step 1: Open the URL: https://programmablesearchengine.google.com in a browser and click the “Get started” button. You will be asked to log into your google account.

Step 1 to add the Google search box to a website

Step 2: In the textbox “Sites to search”, add your website.

You can add any of the following:
Individual pages: www.example.com/page.html
Entire site: www.mysite.com/*
Parts of site: www.example.com/docs/* or www.example.com/docs/ Entire domain: *.example.com

Step 3: Give some nice name to your search engine in the textbox “Name of the search engine”. Select “I am not a robot” and click the “CREATE” button. The next page will say, “Congratulations! You’ve successfully created your search engine.”

Step 2 to add the Google search box to a website

Step 4: Click the “Get code” button to get javascript (JS) code. If you want to customize the look of the search box, you can click the “Control panel” button.

Step 3 to add the Google search box to a website

Step 5: Add the JS code to your webpage(s), and the Google search box will appear on your website.

That’s all. Now you are ready to use Google search instead of CMS search on your website.

Additional step: If you want to enable “Image search”, go to the control panel, and turn it on.

Step 4 to add the Google search box to a website

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.