Google Ads In the middle of Blogger Post

Google AdSense Ads in the middle of the blogger post. You may already know that Blogger Blog dose not support Google AdSense Ads in the middle of the post. Therefore you need to apply a little hack to the blogger template. In previous post we have gone through a bit complicated method.

Before we start applying the hack make sure you backup your blogger template.

Go to Layout and then to Edit HTML you will find a link to Download Full Template. Click on the link to download the template back up and save it in a secure place.

Another simple method I use to back up the Blogger template is to check the Expand Widget Templates and then copy the whole HTML code in the box to Notepad and save it in a secure place.

After backup blogger template you have to enable Google Ads between posts.

Go to Layout and then to Page Element and click the edit link on the Blog Posts element. Check Show Ads Between Post check box. Then configure inline Ads that suits your template. (What colour combinations are best for my site?).

Main reason to enable this feature is to get the blogger post compatible AdSense to code. Normal AdSense code does not work in the middle of the blogger post as Blogger post body dose not support Java Scripts.

Step by step guide to add Google AdSense Ads in the middle of the blogger post.

Go to Layout and then to Edit HTML and check the Expand Widget Templates.

Search the following code line in the HTML. (I would use Google Chrome to Search (CTR+F) this HTML code as it search inside the text box)

<data:post.body/>

Copy and paste the following code just before the above code line.

<div style='clear:both; float:right;  margin-left:5px;'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- Your AdSense code here -->
<b:if cond='data:post.includeAd'>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>
</b:if>
</div>

Save Template and check out your blog and the Google Ads Should be display inside the blog post.

PS: I forgot to tell you that I have add a extra line that will not display any adds when you are in the home page. It only display the ads when you are in the Post page. If you would like to show adds on the home page you can use the following chord.

<div style='clear:both; float:right;  margin-left:5px;'>
<!-- Your AdSense code here -->
<b:if cond='data:post.includeAd'>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>
</div>

Update:
How to remove the Adsense Ads just after the post.
When you enable Ads after the post from Blogger it will show ads in the middle of the post as well at the end of the post. Find the followinf code in the Edit Html ( Layout > Edit Html > Check Expand Widget Template check box)

<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
 <b:include data='post' name='comments'/>
     </b:if>
     <b:if cond='data:post.includeAd'>
       <data:adEnd/>
       <data:adCode/>
       <data:adStart/>
     </b:if>
     <b:if cond='data:post.trackLatency'>
       <data:post.latencyJs/>
     </b:if>
   </b:loop>
   <data:adEnd/>
 </div>

Remove or comment out the code that displaying the Ads.

<b:if cond='data:post.includeAd'>
       <data:adEnd/>
       <data:adCode/>
       <data:adStart/>
     </b:if>

You can basically replace the above code with the follwoing code.

<b:include data='post' name='post'/>
     <b:if cond='data:blog.pageType == &quot;item&quot;'>
       <b:include data='post' name='comments'/>
     </b:if>
     <b:if cond='data:post.trackLatency'>
       <data:post.latencyJs/>
     </b:if>
   </b:loop>
   <data:adEnd/>
 </div>

Hope this will help.If you come cross any problem or any improvements share it with us.