How to Add Google Site Search to WordPress

While WordPress has successfully emerged as the most popular Content Management System (CMS), it still performs poorly in the search department. If you are using the default search feature in your WordPress website, your visitors might not get the appropriate results. For that reason, most WordPress websites rely on Google to provide the search facility.

In today’s tutorial, I will show you how to add Google site search to your WordPress website. After going through this tutorial, you will learn how to –

1. Add Google site search without using a plugin,
2. Add Google site search by using a plugin.

Let’s see how to do it without using a plugin.

Adding Google Site Search without Plugin

In order to add the Google search feature in our website without using a plugin, we will use Google’s Custom Search Engine (CSE). Here are the steps.

1. Log in to Google’s CSE

If you are already signed into your Google account, you will be automatically signed in. Otherwise, click the ‘Sign in to Custom Search Engine’ button. You can log in with your Google account. Once you have logged in, click the ‘New Search Engine’ from the left menu.

2. Set up the Search Engine

In the ‘Sites to search’ field, provide the name of your website. In the ‘Name of the search engine’ field, provide a name for your search engine. Then, click the ‘Create’ button to continue to the next step. At this point, you will be greeted with a welcome message.

This page provides you with three options. The first one, ‘Add it to your site’, provides the code for your website, we will come to this one later. ‘View it on the web’ allows you to see how your custom search engine looks.

Lastly, ‘Modify your search engine’ will let you customize your search engine. We will make some customizations now. Click the ‘Control Panel’ button. You will be taken to a page like the following –

3. Customize  the Search Engine

This is the control panel of your search engine(s). All the necessary links are listed in the left side. By default, you will be taken to the ‘Setup’ section. Here, you can change the name of your search engine, provide a description, allow image search and speech inputs, add additional websites etc. To change the look of your search engine, click the ‘Look and feel’ menu.

This section lets you choose the layout for your search engine. By going to the ‘Themes’ tab, you can choose the theme. Then, the ‘Customize’ lets you select the font, border color, background color etc. for the search box, search button, result title, result URL, promotions etc.

4. Get the Code to Embed

Once you have made all the necessary changes, click ‘Save and Get Code.’ This will save all of your customizations and will take you to the page where you will find the necessary code for your search engine. Copy the code from this page.

5. Add Google Site Search by editing  searchform.php

Take note that with this approach , the Google search Box will appear in every template which calls the get_search_form() function

Go to Appearance > Editor. Find out the searchform.php file and click to open it in the editor. Delete the content of the file (if any), paste the code you copied from the Google custom search engine and then click the ‘Update File’ button.

A lot of themes don’t have searchform.php files. In that case you have to create one.  After creating the file, paste the code from Google custom search engine and save it. Then, upload the file to your theme directory by using a FTP client like FileZilla.

5. Add the Modified Search Widget 

Now that we have edited the searchform.php , simply go  Appearance > Widgets and drag the  ‘Search’ widget  to your desired location. Provide a title if you want and click ‘Save.’ That’s it. You can now enjoy the custom search engine on your website.

6. Add Google Site Search Using a Text Widget

If you dont want to mess with searchform.php then you simply make use of the the mighty text widget. Simply Copy Paste the Js code to the text widget and a Google Search Box will appear in your SideBar. This approach is best if you only want Google Site Search to appear on your sidebar.

Adding Google Site Search with a Plugin

If you don’t like the manual process of adding a Google site search, you can use a WordPress plugin. While there are lots of plugins which offer that functionality, I will use Search by Google for this tutorial. This simple plugin does only one job and it does the job perfectly.

First of all, install and activate the plugin. Then, go to Appearance > Widgets. There, you will find a new widget titled ‘Search by Google.’ Drag that window to your desired location. Provide a title, define the submit button text and click ‘Save.’ If you reload your website now, you should see the search box in its place.

Conclusion

Well, that’s it for today. I tried to explain the process as simply as I can. However, if you still have any question about adding Google site search to your WordPress website, please leave a comment below. You may also share some other ways of doing this.