If you use Google Adsense then you will probably be aware that there is an option to place a Google Search box on your blog so you can earn money for every search that is conducted. I’ve never really been a fan of the fact that it takes the searcher to a boring results page away from your blog.
Did you know that with a little bit of customisation and editing you can actually have the search results appear on your blog instead of showing on a page that is not connected with your blog?
I’m going to show you how to do it.
What you will need:
- Google Adsense account
- Some Spare Time (about five minutes at the most)
- Exclude Pages plug-in
Step One.- Setting Up Search
The first thing you need to do is to get Google Search set up. So go to AdSense Setup > AdSense for Search and fill in the fields as you see fit and click next.
When you get to the Search Results Style page (should be third page) you should see the following options:
1.1 Opening of search results page
You have three choices, the one you want is the bottom one ‘Open results within my own site’. This will reveal a field below it. This is where you type in your search page, it will be http://yourdomain.com/search/.
Leave ‘enter width of results area’ as 800 for now, you can’t make it lower here but I will show you how to do that later on in this tutorial.
1.2 Ad Location
This is where you want your results to appear on the blog search page. I’d suggest Top and Bottom. You can always edit this later on.
All you have to do now is click Next, then give your search page a name and click Submit.
Step Two – Placing Search On Your Blog
You will see two sets of code. The first set of code is your search box code. This is to be placed where you want the search box to show up in your blog template.
Take the second set of code and go into your WordPress admin panel. Go to Pages and create a new page. This page will be called ‘Search’. Put the second set of code into the page, disable the comments & the pings and then publish.
Now go and test it out. Type something into you search box and see what the results page looks like.
If the results are too wide go back to your admin panel and go to the Search page. Find the section of the code that looks like the bit below:
var googleSearchFrameWidth = 575;
Edit the size to suit your design.
Step Three – Removing Search Page From Menus
If like me you don’t want the Search page showing up on your menu because if people click it directly they will see a blank page. I use the excellent Exclude Pages plug-in which makes this process so incredibly easy.