Wednesday, February 11, 2009

Placing Ads between posts with custom blogger templates

I changed the template of my blog to a custom 3 column template. Unfortunately doing so wiped out my option of placing ads between posts, even with the option still checked. After hunting through the template code I was able to figure out how to put them back.

1. Keep in mind that blogger (aka blogspot) has a policy of only placing 3 Adsense units on your blog. That means if you placed 2 Adsense gadgets already only 1 Adsense unit will show up between posts. If you have 3 Adsense gadgets already, then no Adsense units will show up between posts. If you have no Adsense gadgets installed then 3 Adsense units will show up between posts. Get it? Good.

2. Log into your blogger account. Go to Layout->Edit HTML

3. Click Expand Widgets Template box. This step is very critical, without it the Adsense gadgets will not show up. It's also important for backing up your template. Click the image below to enlarge the image of box I am referring to.


4. Back up your template before we go any further. If you make a mistake you can just copy and paste your backup into the text area. To do this click Download Full Template.

5. Now for the fun part. You'll need to insert some html code. You'll want to find a section that looks like the snippet below. I usually just do a search for adEnd to find the section. If you have other Adsense gadgets you may need to do the find a few times before you get to the right location.

1: <data:adStart/>
2: <b:loop values='data:posts' var='post'>
3: <b:if cond='data:post.dateHeader'>
4: <h2 class='date-header'><data:post.dateHeader/></h2>
5: </b:if>
6: <b:include data='post' name='post'/>
7: <b:if cond='data:blog.pageType == "item"'>
8: <b:include data='post' name='comments'/>
9: </b:if>
10: </b:loop>
11: <data:adEnd/>


6. Copy and paste the code from this step. Now that you have found the section in step 5 you will want to enter the following code between lines 9 and 10; that is between </b:if> and </b:loop>:

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.includeAd'>
<data:adCode/>
</b:if>
</b:if>

7. Here's a picture of the difference between steps 5 and 6. You will need to click the image to enlarge it so you can actually see the text.


8. The finished product. This is what the whole section from step 5 should now look like:

<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.includeAd'>
<data:adCode/>
</b:if>
</b:if>
</b:loop>
<data:adEnd/>

9. Ok, you should be good to go now. Preview the template to make sure everything is valid. If blogger doesn't complain you're in good shape. Click the Save Template button and you're now finished. If it did complain copy and paste your backup into the text area and start over.

Now go make some money on your blog. =)

Speaking of making money, since I am a poor vagabond, if you found this post helpful show some love and click an Ad of mine. Thanks and hope this helped!

2 comments:

Easy Forex for You said...

wonderful.. i was in search of this technique for my site www.forex4realincome.blogspot.com and www.learny2earny.blogspot.com thanks

Kawe said...

hi...

how about my COMMENT POP UP don't want appear when someone click it? how to fix it?

http://namidiestory.blogspot.com

my email: eightwan@yahoo.com

need help here.

tq