[Updated]Please read Display AdSense Ads Efficiently and Conditionally Show Alternative Ads, which introduce a simpler way to implement same function.
AdSense allows 3 standard ad units and 3 link units in one page.
This is enough for us in most cases. But sometimes we want more flexibility: to be able to conditional display of AdSense Ads.
For example, in lifelongprogrammer.blogspot.com, we display 3 standard ad units in post: one at header, one at left-sidebar, and one inside the post body.
But when view the homepage or archive page, label page, it's kind of messed up: it does display 3 standard ads, but one is at header as expected, the other two is inside the first two posts. The ads slot at left side bar is left blank. This makes the site looks ugly.
This is because AdSense fills up to 3 ads in the order of ads in html page. In blogspot template, the html order is: the header, then center post, left sidebar, then right sidebar.
I want to make sure the ad in left side bar always display and always display 3 AdSense Ads. So I make the following changes:
At home, archive and label page, display alternative ads(I choose chitika) in post body, display 2 AdSense ads in left sidebar.
At post/item page, display AdSense ads in post, display one AdSense ads, one chitika ads in left sidebar..
Next, how to do it?
Conditional Display Ads in Post Body
Put the following code to the location where we want to display ads when write a post.
This checks whether the pathname of url matches /[0-9]{4}/[0-9]{2}/.* If so, means this is a post/item page, display AdSense ads, otherwise display chitika ads.
<script>
//<![CDATA[
var isItemPage = (document.location.pathname.match(new RegExp("/[0-9]{4}/[0-9]{2}/.*")) !=null);
if(isItemPage){
document.write("<ins class='adsbygoogle' ... data-ad-client='' data-ad-slot=''></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});<\/script>")
} else {
chitika-ads-code
}
//]]>
</script>
Conditional Display Ads for the Second Ads in Left Sidebar
Add a HTML/JavaScript gadget at Left Sidebar in Layout page, put the following code in content text box.
It is not a post/item page, display AdSense ads, otherwise display chitika ad.
<script>
var isItemPage = (document.location.pathname.match(new RegExp("/[0-9]{4}/[0-9]{2}/.*")) !=null);
if(!isItemPage){
document.write("Google-AdSense-Ads-Code");
} else {
chitika-ads-code
}
</script>
Now it looks much better, no blank ad, and always display 3 AdSense ads. Display alternative(chitika) ads for ads slot in post when at home, archive and label page.
For better performance, I will put the code which detect page type before the start body tag, so it will be just executed one time.
<script>var isItemPage = (document.location.pathname.match(new RegExp("/[0-9]{4}/[0-9]{2}/.*")) !=null)</script>Utilize Horizontal Link Units
dSense also allow us to put 3 links units, so I choose one above the header ad - this is easy, just add one HTML/JavaScript gadget, one below the title, one below post body, and I want these two only display in item/post page.
How to do it? Basically, it is to edit Blogspot template, put the following code below
<script>
if(isItemPage){
document.write("<ins class='adsbygoogle' ... data-ad-client='' data-ad-slot=''></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});<\/script>")
}</script>
Read more from
How To Insert Adsense Ads In Blogger Post
