Webpit.com

I did some hacking with Word Press today to replace its built-in search with Google Adsense Search. It was fairly easy, and I’ll explain how in this post.

First you’ll need to setup your Adsense account and get your search code. During the setup process you will be asked an important set of questions which controls how the search results are displayed. By default, Google opens a separate window to display your search results. This resulted in an ugly format, and lacked my WordPress theme. Choose the options as shown in the window below:

This should result in Google providing you to pieces of code, the Search Box code, and Search Results code. Use the Search box code in your leftcolumn.php theme file to replace the search box that WordPress defines.
I made some changes to Google’s generated code to make it fit my left column, and to make sure it posted to the index.php. Google uses a lot of hidden form fields to define the search results. We will use one of these hidden fields to tell our theme index.php file to display search results instead of the blog posts.

Here’s the portion of my hacked theme index.php that displays Google’s Adsense-enabled search:

At the top of my index.php, before the blog post code:

<div class=”centreblock”>
<?php if(isset($_GET[‘client’])) { ?>

<!– Google Search Result Snippet Begins –>
<div id=”googleSearchUnitIframe”>&tl;/div>

<script type=”text/javascript”>
var googleSearchIframeName = ‘googleSearchUnitIframe';
var googleSearchFrameWidth = 700;
var googleSearchFrameborder = 0 ;
var googleSearchDomain = ‘www.google.com';
</script>
<script type=”text/javascript”
src=”http://www.google.com/afsonline/show_afs_search.js”>
</script>
<!– Google Search Result Snippet Ends –>
<?php } else {?>

Now, further down the file, you will see this:

<?php
include_once(‘leftcolumn.php’);
include_once(‘rightcolumn.php’);
?>
</div> <!– centreblock –>

We need to add the following line:

<?php } // end google search if ?>
<?php
include_once(‘leftcolumn.php’);
include_once(‘rightcolumn.php’);
?>
</div> <!– centreblock –>

Of course, depending on your WordPress theme, your actual code might be different. I’m trying to think of other cool Googlish hacks I can do to WordPress, got any ideas?