Integrate Google Adsense Search into WordPress Default Search

Add Google Adsense search into your wordpress default search replace it here method to Integrate and combine Google Adsense Search and WordPress Default Search.This is more accurate and earn money for you also.

Search Functionality in WordPress

In most WordPress Themes there are two php-files that handle the search form and search results:

• searchform.php
• search.php

searchform.php is the actual search form and it can be displayed anywhere in your blog. Most templates display search form at the top of the sidebar or in the header , but your template might have it elsewhere or nowhere at all. If your template doesn’t have default search you can add it yourself, or you can use a search widget to display search.

search.php is used to display search results, based on the search query from the search form displayed by searchform.php.

Setting Up Google Custom Search

1. Go to Google AdSense
2. If you don’t have a Google Account yet, Create a Google Account
3. In the AdSense control panel, go to the ‘AdSense Setup’ tab
4. Click on the ‘AdSense for Search’

Now it’s time to setup the Google Custom Search

 

1. Choose “only sites I select”
2. Enter your domain + “*” to the Selected Sites list. e.g. thinkadsense.com/*
3. Check the other options, which should be ok by default. Hit Continue >>
4. Edit the looks of the search box or if the Default “Look & Feel” is OK, Hit Continue >>
5. Choose “On my website using an iframe“, and
6. Enter URL where search results will be displayed: http://yourdomain.com/index.php? – e.g. http://www.calculusinfosoft.com/index.php?
7. Don’t forget the question mark (?) after the index.php
8. Edit the search results palette and options, when satisfied, Continue >> again.
9. Hit Submit and Get Code

On the next page, you will see two or three boxes, one with Search Box Code, and the other with Search Results Code and third is Popular queries(paste with search result).

• The Search Box Code will go into searchform.php
• The Search Results Code will go into search.php

Editing the WordPress Template and Inserting the Google Custom Search

Step 1 : searchform.php

• Go to Theme Editor in WordPress.
• Open searchform.php (or edit it directly through ftp or such)
• Look for the original search form, which starts with <form> and ends with </form>
• Take a copy of the original form, and paste it to text editor.
• Now, replace the original form in the searchform.php with the Google Search Box -code (the one with <form> and such)
• Insert this line between the Submit line and </div>

<input type="hidden" name="s" value="" />

• The “s” is used by the default WordPress Search, as Google Custom Search uses “q”
• There should be this kind of text inside the form tag:

<form action="http://www.calculusinfosoft.com/index.php?" id="cse-search-box" >

• Add the name variable and onsubmit -command inside the form tag, like this:

<form action="http://www.calculusinfosoft.com/index.php?" id="cse-search-box" name="searchform" onsubmit="document.searchform.s.value = document.searchform.q.value" >

if your custom theme uses some other name than “searchform”, replace searchform with whatever you want, just make sure you replace it in the name=”” and inside onSubmit as well. With this we can pass the search terms in the s-variable (used by WordPress search) as well as the q-variable (used by the Google Custom Search).

If your original search form (you have copied on the text editor) had some custom names or id’s, try to put them in without messing the Google search code. I added the id and class variables from my theme. You can also add default value to the text input if you like, like this (using fancy javascript to change it based on user activity).

In the end, you will have something like this in your searchform.php:

<form action="http://www.calculusinfosoft.com/index.php?" name="searchform" id="searchform" onSubmit="document.searchform.s.value = document.searchform.q.value" >
<div>
<input type="hidden" name="cx" value="partner-pub-xxxxxxxxxxxxxxx" />
<input type="hidden" name="cof" value="FORID:10" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" name="q" id="searchbox" value="Search from yourdomain.com" onfocus="if(this.value == 'Search from yourdomain.com') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search from yourdomain.com';}" />
<input type="submit" name="sa" value="Go" />
<input type="hidden" name="s" value="" />
</div>
</form>
<script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&amp;lang=en"></script>

• You should now have functioning search in your blog, but only the default WordPress Default results are visible.
• Change thinkadsense.com with your own domain

Step 2 : search.php

To get the Google Custom Search results visible too, we have to edit the search.php

This is even easier than the searchform.php edit, as you just have to take the Search Results Code from the Google AdSense for Search page, and insert it in the search.php where you see fit. I placed it on the top portion, over the WordPress post results, which start with: <?php while (have_posts()) : the_post(); ?>

If you don’t care about the default WordPress Search results, and just want the Google Custom Search in, the most simple search.php (Search Results) page looks like this (ignoring the sidebar):

<?php get_header(); ?>
*GOOGLE SEARCH RESULTS CODE HERE*
<?php get_footer(); ?>