Add Google custom search API to your WordPress search

If you’re using Google AdSense, you will probably know about Google custom search API. If you don’t like the WordPress built-in search feature and you would like to implement Google custom search to your WordPress theme and you don’t know how.

Don’t worry, I’m going to teach you to do that. I will try to do this a simple as I possibly can in a step by step easy and to follow instructions. In this tutorial, I will be using Twenty Eleven 1.2 theme.

Reason being the simplicity of the theme itself. Easy for me to demonstrate how to add the Google custom searchbox since the theme already have a ready made searchbox and an extra php template needed for this tutorial. For other themes that doesn’t have a searchbox, you need to manually create and style your theme and add new css to it . I will write that tutorial later on.

This going to be a lengthy tutorial. 😥 Okay, here goes…

There are 2 things you will need:

  1. Google custom search codes (click here if you’re not an AdSense publisher yet) [1. There are 2 codes to be added to WP search box and search results page]
  2. Exclude Pages plugin (download at or Author) [2. This plugin will hide search results page and title from your navigation menu bar. It’s pointless to have a page when your curious readers clicking on it and find out it’s just an empty page. Besides, search results page only works when your readers using the searchbox to search your blog.]

1. Getting Custom Search Engine Codes

First let’s get the searchbox and search results codes.

Go and log in to your AdSense page. Click on My Ads tab -> Search -> Custom search engines -> +New custom search engine -> new creation page will appear titled Create new custom search engine.

Your settings page should be like the example shown below. Just follow what I have suggested for you. You can experiment with the settings later. We’re going to do some modifying to the codes and adding it to the searchform.php and creating new template page for the search results.

Custom search engines settings 1 Custom search engines settings 2 After you have set all the settings, save and generate the codes. You will get something like the one shown below. Keep these codes by pasting in your Notepad or Wordpad and saving it. We’re going to need this afterwards.

SearchBox Codes

Search Results Codes

Leave a Reply

Your email address will not be published. Required fields are marked *

Next Post

Most Successful Startups in 2015

Mon Apr 30 , 2012
Cras sit amet libero eros, in ultricies lorem. Nunc et odio neque. Maecenas vehicula interdum hendrerit. Integer hendrerit orci ullamcorper neque pellentesque feugiat. Aliquam magna metus, fringilla non ultrices id, fringilla eu erat. Phasellus lorem tortor, porttitor volutpat iaculis sed, condimentum ultricies massa. Curabitur ut malesuada elit. Nullam tortor mi, […]
photodune  group of business people working on an office desk s