skip to content
Website Builder

Adding AdSense to application/xhtml+xml pages

CSS play Support


CSS play Recommend

SitegrinderPSD to HTMLFree, practical CSS menus, layouts, and examplesuk white label shopping carts for resellers



Information

You've applied and been accepted by Google to add AdSense to your site but, because you are serving your pages correctly as application/xhtml+xml, the ads are failing to display.

Well this is how I did it, based on Making AdSense work with XHTML but a bit simpler.

The fact that you can see the 'ads by Goooooogle' above means that it works.

Google AdSense uses the JavaScript function document.write() for the ads and when XHTML is served as 'application/xhtml+xml', document.write() doesn't work. Also the ads are embedded in an iframe, which is not allowed.

To overcome this I created a separate code snippet which includes the javascript and a little styling, and embeded this in my page using the object tag.

See the article at 456bereastreet for Google's ok on this method.

I have also contacted Google to confirm that this method does not break any rules and have received this reply from James (The Google AdSense Team) 'Your implementation appears to be compliant with our program policies at this time.'

Internet Explorer

If we use the same code for Internet Explorer it will display correctly, BUT the links will open in the object tag NOT as intended in the main browser window.

To get around this I have added one conditional comment style to remove the object from Internet Explorer's display and another conditional comment to place the adsense code directly in the page. These conditional comments are hidden from all other browsers.

The code snippet - ads.htm

<body style="overflow:visible; border:0px; padding:0; margin:0;">
 <script type="text/javascript">
<!--
your Adsense parameters here
//-->
</script>
 <script type="text/javascript" 
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
 </script>
</body>

xhtml

<div id="ads">
<object data="ads.htm" type="text/html" 
 width="468" height="60">
</object>
</div>

Change the width and height to suit your selected ad format.

Style the "ads" div as you wish, or simply not use it.

Conditional commet #1

Put this in the <head> </head>

<!--[if lte IE 6]>
<style>
#ads {display:none;}
#adsie {clear:both; text-align:center; 
width:750px; margin-top:10px;}
</style>
<![endif]-->

Conditional comment #2

Add this beneath the 'ads' div

<!--[if lte IE 6]>
<div id="adsie">
<script type="text/javascript">
your Adsense parameters here
</script>
<script type="text/javascript" 
 src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
<![endif]-->

AdSense Info

CyberWyre has a useful list of the Highest Paying AdSense Keywords.

'mesothelioma lawyers' is at the top, paying a whopping $54.33. Lawyers certainly have a lot of money to throw at advetising.

Good luck with your Google AdSense and I hope that you make more money at it than I do :(

29th May 2006

I have decided that it is better and easier to use xhtml1.0 Strict served as text/html for this web site as it overcomes all the problems involved with having to serve xhtml1.1 as application/xhtml+xml.




Copyright

You may use this method on your personal 'non-profit' web site without seeking my permission. A link back to CSSplay is always appreciated.

Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSSPlay.

If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced. Please email me for more information.



CSS play Recommend

CSS play Testimonial

"The citroen.co.uk web site uses
CSS play code for the site drop down menus.
This code works seamlessly in IE 6 & 7, and is an excellent solution to the Creative requirements of the site."

Damon Clark - Brandwidth

CSS play Pages