Continuing from my previous post on improving WP search function using plugins, I’m going to show you how to integrate Google Custom Seach Engine into your blog. Live demo here.
Advantages include:
- Results are sorted by relevancy
- All content in posts/pages (e.g comments) are searchable
- Make some money by displaying relevant ads using AdSense
Hold your horses!
First we need to find out how well Google has indexed your blog. If your blog isn’t properly indexed, Google can’t return relevant results and that would defeat the whole purpose of outsourcing the search function. In that case, you are better off sticking to using search plugins.
Now go to google.com and type in the following and replace my blog url with your own blog.
site:ericulous.com
You will see the number of of pages indexed by Google and of course the search results. Does the number of pages tally with your blog? Are you liking the results returned? There’s no hard and fast rule here. Generally if you have a established blog, you need not worry much. Whereas fresh blogs might not be properly indexed (yet).
With that out of the way..
Step 1: Create a Custom Search Engine for your blog
A. Login to http://www.google.com/coop/cse/
B. Click on the “Create Custom Search Engine” (big blue button)
C. Fill in the form (sample as below)
D. Click “Next” button and on next screen, click “Finish” button
E. Click on “Control Panel” and then on “Code”
F. Specify the url in your site for the search results to appear (http://ericulous.com/googlesearch for me)
G. For ads, I opted for “Top & Right” (remember to enter your adsense id in “Make Money” tab)
H. Leave this window open as we’ll need to copy and paste the “Search box code” and “Search results code” later
Step 2: Modify theme files
I will be using the Default Wordpress theme for illustration here. Adapt to your theme as and where needed 
A. Modify searchform.php
Replace following with the “Search box code” in Step 1H
<form method="get" id="searchform" action="<?php bloginfo('url'); ?>/">
<div><input type="text" value="<?php the_search_query(); ?>" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form>
B. Create a new page template
1. Duplicate a copy of page.php and rename it googlesearch.php
2. Open googlesearch.php and add the following code at the top
(before < ?php get_header() ?>)
<?php
/*
Template Name: GoogleSearch
*/
?>
3. Replace following code (for maximum width)
<div id="content" class="narrowcolumn">
with
<div id="content" class="widecolumn">
4. Delete the following code (to remove sidebar for maximum width)
<?php get_sidebar(); ?>
5. Delete the following code
<?php the_content('<p class="serif">Read the rest of this page »</p>'); ?>
and in place, add both the Search box code and Search results code in Step 1H
Step 3: Create a new page in Wordpress
A. Go to Admin Panel > Write > Write Page
B. Enter a page title
C. On the right menu, look for “Page Template” and select “GoogleSearch”
D. On the right menu, look for “Page Slug” and enter “googlesearch”
Now you have the King of Search at your bidding
