Sunday, March 02, 2008

How To Hide Google Adsense Ads In Home Page And Display Them Inside Post Pages Alone [Blogger Hacks]

One of my friends recently approached asking me to help him to hide Adsense ads on the home page of his blog and display them only in the individual article pages. It is a good idea to remove Ads from home page and display them in the article pages to give a professional look to the blog.

He motivated me to write this article and share the information of how to configure Blogger blog template to display ads only in the post pages alone. Let us see the steps to be followed for modifying the template to implement this

  1. Log in to Adsense
  2. Generate code required for displaying appropriate ads on you blog and paste it to a notepad
  3. After pasting the code to the notepad, remove the line breaks and comments from the Adsense code. Make sure that you code looks like the following (do not to modify any script of Adsense, just remove the line breaks and comments alone)

  1. Your Adsense code is ready now. Lets modify blogger template
  2. Log in to your blogger account select Layout of the blog which you want to modify
  3. Navigate through Template --> Edit HTML
  4. Take backup of your template by clicking Download Full Template. This backup will help you if you want to revert to old template
  5. Select Expand Widget Templates option to get access to the full code of the template
  6. Search for <data:post.body/>  in the template HTML and place the following before the <data:post.body/>

<b:if cond ='data:blog.pageType == "item"'>

<!-- Paste your adsense code prepared in step 3 here -->

</b:if>

  1. Replace the text <!-- Paste your adsense code prepared in step 3 here --> with the adsense code which you prepared in the step 3 using notepad.
  2. After completing the replace operation, code in your template should look similar to the following

<b:if cond='data:blog.pageType == "item"'>
  <script type="text/javascript">google_ad_client = "pub-asdfsadff";google_ad_slot = "123123123";google_ad_width = 336;google_ad_height = 280;</script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>
</b:if>
<data:post.body/>

  1. Save the template by clicking on Save Template button
  2. That's all. Your Blogger template is configured to display ads only in the post pages

Troubleshooting Guide

Why Ads are not displayed?

This happens if you modify any attributes of Google Adsense ads by mistake while removing the comments and line breaks.  To solve the problem, get the Adsense code again from Google Adsense and remove the line breaks and comments carefully.

Why Ads are displayed in a table with borders around them?

This happens when the line breaks and comments are not replaced from the Adsense code pasted in Blogger Template. Remove all the line breaks and comment start tags and end tags to solve the problem.

If you face any other problems, please post a comment. We will help you to solve the problem.

7 Comments:

Clyde said...

Thank you my friend for this article, I will be writing a post and linking to this article.

But what about the footer ads I am not smart enough to figure it out unfortunately :D

The text ads in the footer to be put in only main post. Waiting for this solution as well, thank you very much for this help of yours!

Cheers!

Clyde said...

dude iv figured it out :)

Cheers,

Ill be posting the article in a day or two cheers!

Anonymous said...

Can same be done for the speacify label for the post..

for example i don't want the ads on the post containing the lable "My Personal"

Please guide

Slym said...

Thanks for the help. I follwed step by step and was able to implement desired functionality on my site http://www.knowtheworldaround.com, except with the change that when I pasted the code before
data:post.body/
it didn't worked but when I pasted it a line before
div class='post-body'
it served the purpose. Slym

fey said...

hey,,,
i use tht trick,, but why ads not appear in picture?? my ads code tht paste in templte is kind of pic ads ... help me..chek on
www.feyware.blogspot.com

Cezille said...

thanks a lot sir! Now I can hide my adsense in frontpage of my blog.

denparser said...

hello, thanks for this. it really helps. i now hide the adsense on frontpage of my site. wish you luck. keep it up.