Placing AdSense Ads in the middle of Blogger posts

Hackman has an interesting hack to place AdSense ads right in the middle of your blogger posts. In this hack, Hackman places a HTML comment at the desired location in the post body while composing the post. Then using JavaScript he moves the contents before the HTML comment to a blank <div> tag before the AdSense code.

Hackman's hack is meant to work with the classic templates of Blogger. I have tweaked it a little to make it work for the new Blogger (layout) template. Here you go...

Find the <data:post.body/> tag in your new Blogger (layout) template and replace it with (Use copy-paste as some text below might be out of view):


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

<div expr:id='"adsensical" + data:post.id + "start"'></div>

<div style="margin:5px 0 -5px 10px">
<!--PLACE YOUR AD CODE HERE-->
</div>

&lt;div id="adsensical<data:post.id/>end">
&lt;div id="adsensical<data:post.id/>body">
</b:if>
<data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
&lt;/div>
&lt;/div>

<script language="JavaScript">&lt;!--
//AdSensical Place Ads in Middle of Blogger Posts
//By hackman_3vilGuy http://adsensical-adsense.blogspot.com
//hackman {AT}caller {DOT}me {DOT}uk
//Modified for New Blogger (Layout) Template by Aziz (http://hashout.blogspot.com/)
topbit=document.getElementById("adsensical<data:post.id/>start");
bottombit=document.getElementById("adsensical<data:post.id/>end");
s=document.getElementById("adsensical<data:post.id/>body").innerHTML;
var regexIndex=s.search(/&lt;!--adsense-->/igm);
if(regexIndex>0) {topbit.innerHTML=s.substr(0,regexIndex);bottombit.innerHTML=s.substr(regexIndex+14);}
//-->
</script>
</b:if>

Now just replace  with your AdSense JavaScript code which you got from AdSense Setup and place  anywhere within your post where you want the ad to appear (Make sure you insert it in Edit HTML mode).

The above code displays ads only on item (post) pages. If you want to display the ads on main or archive pages also, just remove the <b:if cond='data:blog.pageType == "item"'> and </b:if> tags. AdSense will automatically display only the first three ads on the page (in order of its appearance in the HTML) including the ones outside the posts section.

If you do not insert the HTML comment into your post content (HTML), then the ads will appear before the post body, but after the post title.

If you would like to see it working live before you begin implementing it on your blog, take a look here.

Related posts:

If you enjoyed this post then Bookmark or Subscribe to HashOut for FREE!

Read more on AdSense, Blogger, Blogger Hacks, Blogging