Using Adsense for Search with WordPress

This one totally slipped under my radar until today.

Did you know that Google has added an "open results within my own page" option to their AdSense for Search program? Now, rather than sending readers to an off site search result page you can actually build a local template to handle search results on your site! Using some tricky JavaScript Google actually generates search results and places them within your own page.

One of the major reasons I wasn't using AdSense for Search originally was it's lack of customization options. Beside being unable to customize the search box I was also disappointed with the lack of options for customizing the results page. That's all changed today.

While Google still restricts a lot of your options for displaying results (you can't display results in a space smaller than 500px) they have opened up a lot of potential. On this site, for example, I've managed to build a new WordPress theme page specifically for handling Google Search Results. Using a custom page templates, a blank page, and some code from Google you too can get AdSense for Search working in WordPress!

Here's how it works:

Building the Template:

To get started you're going to want to create a blank custom page template. You can read more about this on the WordPress Codex under "Creating your own Page Templates." Because the page will primarily be displaying the search results from Google you can skip entering any loop code. Instead you can simply add the code provided by Google in the "Your Search Results" box. Along with any calls to the header, footer and sidebar.

Because the main portion of my website is smaller than Google's minimum requirements (by about 50px) I don't invoke the sidebar - I just let the results load in the main template. You can see the code below:
<?php
/*
Template Name: Google Results
*/
?>
<?php get_header(); ?>
Google Code will go here - not yet though
<?php get_footer(); ?>


Activating the Template

Once you've got your template setup you need to create a new Page. Head over to Write->Page and title the page "Google Search Results." On the right sidebar select "Google Results" and save the page. Because you're not using the loop nothing else is necessary. Just save the page and then click "View Page" when it appears toward the top of the form.

You can also click Manage->Pages and click view on the "Google Search Results" page as well.

At this point you're going to want to note the URL. Our next step involves filling out all the forms over on Google's AdSense for Search site and the URL of the "Google Search Results" page is vital for this. Based on my site's structure my URL looked like this "http://bill2me.com/google-search-results/"

Getting the Google Code

Setting up the code on Google is extremely easy. Just follow all the on screen prompts, when you get to the "Opening of search results page" make sure you select "Open results within my own site" and then add the URL of your new WordPress page in the text area.

Once all the forms are filled in you just have to add the code to your theme. All the code in the box titled " Your search box code" can be placed where you'd normally place your search form. The text in the next box, titled "Your search results code" gets placed in the googleResults.php file. That's it - run a search and see how it turned out.

If you have any questions drop me a line and I'll gladly see what I can do to help out.