The Blogger™ Tutorials: Embed Google Search Results within your Blogger Blog

You might have noticed the new embedded search results on this site.If you have a fair knowledge of the structure of a blogger template you can easily implement the same..

Before we start take a look at the Adsense TOS

AdSense for search results pages may show only a single ad link unit in addition to the ads Google serves with the search results. No other ads may be displayed on your search results page

This really complicates the procedure..First if all make a blank post in blogger with the title Search Results preferably on some earlier date so that the post wont appear to the readers..

Now that you have made the post note down the url of the post.In my case it is

http://www.bloggerplugins.org/2005/06/search-results.html

Ok now goto the adsense site and make a custom search engine giving options such that the search results will appear on the url of our blank blog post..Get the ad codes for the search box and also for the search results

Our Aim is that we shouldn't display any other ads on this search page.

Note- Backup your template first

Now let us see the basic structure of a normal blogger template(i am concentrating only on the parts that we need so i have assumed all div elements as empty).A normal blogger template will have something like this(off course there would be more content within each of the tags..)

Here we are going to display just the Header-wrapper and the footerwrapper and remove all the content from the content-wrapper

So how will we remove it..We can remove them using conditions..

We use the condition to check if the url is the search result page's url..

Here is what i have used for my search result page.

<b:if cond='data:blog.url != "http://www.bloggerplugins.org/2005/06/search-results.html"'>

The coditions to be done when it is not the search result url

<b:else/>

The Conditions to be done if it is the Search Result Url

</b:if>

We are going to hide the entire content of the content-wrapper if the url is the search result url..We are going to do this using the b:if conditions mentioned above

and the result will be something like this

Now save your template and goto the search results page now and see if any adsense ads are shown there..

Verify it further by ensuring that the url http://pagead2.googlesyndication.com/pagead/show_ads.js is not present in the Firefox's Source view of the page

If you are 100% sure that there are no ads appearing on that page. Then goto your template again and replace The Conditions to be done if it is the Search Result Url(Leave it as such for now) with the search results code from google(You may add proper styling and all) Now save your template again.. and now add the adsense searchbox as a HTML/Javascript widget in your blog(You can choose for other methods too). Now if everything went fine when you search something the search results would be displayed on that Search Results posts page that we made. I know it is a little bit complicated.But if you need help from me just contact me.. I will try to fix it out..Actually we can control what all should be displayed on the search results page... Note:-I have used those comments in the code pictures just to make it more simpler.. You may not find them in your template..If you have added adsense ads in the header or footer you will have to hide them on the search results page using b:if conditions