Wednesday, November 15, 2006

Wrapping your Adsense code inside your post

For the past couple of weeks, I've been busy studying different things so as to increase my Adsense earnings. I studied a little bit of Javascript and came up with the following tweak so as to put your Adsense ads inside your post. You will see this code at work at my Wantusawa blog. You'll notice that the Adsense ad is actually inside the post. So, how did I do that? Here is the step by step guide:

1. Back up your template first, ok?
2. Look for <$BlogItemBody$> tag in your template.
3. Replace <$BlogItemBody$> tag with the code below:
<div id="first<$BlogItemNumber$>"></div>

<MainPage>
<table align=left><tr><td>
YOUR ADSENSE CODE (square or rectangle format)
</td></tr></table>
</MainPage>
<ItemPage>
<table align=left><tr><td>
YOUR ADSENSE CODE (square or rectangle format)
</td></tr></table>
</ItemPage>

<div id="last<$BlogItemNumber$>">
<$BlogItemBody$>
</div> <br />

<MainPage>
<script language="JavaScript">
var obj0=document.getElementById("first<$BlogItemNumber$>");
var obj1=document.getElementById("last<$BlogItemNumber$>");
var s=obj1.innerHTML;
var r=s.search(/<adsense>/igm);
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+9);}
</script>
</MainPage>
<ItemPage>
<script language="JavaScript">
var obj0=document.getElementById("first<$BlogItemNumber$>");
var obj1=document.getElementById("last<$BlogItemNumber$>");
var s=obj1.innerHTML;
var r=s.search(/<adsense>/igm);
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+9);}
</script>
</ItemPage>

4. Republish your blog.
5. Now, it's ready. The next step is to mark the place in your post where you want your Adsense ads to appear. How? Use the <adsense> tag.

Example.

This is a post. This is longer post. <adsense> This is another post. This is another post. Etc. Etc.

The ad will appear on the place where you put the tag.

That's all folks!

Note: This only works on current Blogger version, this is not for Beta.
You can put the Adsense Ad to the right by simply changing the align=left to align=right on the table tag.