Thursday, September 11, 2008

Overcoming Problems with AdSense for Search

sourcehealer.net has a Google Custom Search on each of its pages. This is implemented via personalised code javascript code generated by Google as you create each new ad channel.

Search Box

The snippet is pasted to the page where you want it.
We also need to place the style import on the page:
There was a problem with the search box. It was caused because ASPX Master Page generated
tags in unexpected places and this meant that the
tags had to be rearranged carefully or the wrong form was submitted or it used the 'put' method (which is the ASPX default)

The Results Page

The snippet is pasted where you want Google to display the results (and targeted ads).
This all works well until you attempt to have a page that resizes itself to match the browser.
  • changing var googleSearchFrameWidth = 800; to less than 800 will not display results if you are using FORID:9 (Ads on the right only)
  • resizing after download proved particularly difficult
  1. the results are displayed in an iframe which can't easily be controlled using CSS
  2. IE7 treats offsetLeft differently than the others
  3. detecting the browser caused a long search but resulted in a very simple result, see
    another way to detect IE7 in Javascript
  4. finding the iframe was supplied by Changing properties for the search results iframe

The resulting code is driven by <body onload="myOnLoad();" onresize="myResize();" ...

See the resulting resizable page in action.

No comments: