Placing Adsense in Blogger Post

Wednesday, July 9, 2008

Placing Adsense in Blogger Post

As shown here by Darren Rowse, the most hot position to place an Adsense unit is just above the post.

In Blogger, there is no direct method to do that as far as I know. So, I did some research and testing, and it is working now.

Background

- You can place only a maximum of 3 Adsense for content units on a page.
- In the layout HTML, you can place Javascript anywhere, it will act just like normal HTML page (there is some tweaking needed though)
- I have a modified Template.
- It is possible to show some part of the post only when viewing as Post Page and not when shown as part of the blog homepage.

The Method

Here is the step-by-step method to show Adsense unit on top of the post when viewing as Post Page. You can see for yourself how it looks if you are viewing this post in its own Post Page.

1. Find your template

Find out whether you are using Classic Template or Layout. Find this in the HTML source <data:post.body>. If found, you are using Layout. I have not tried Classic Template. Check references to try it out yourself.

2. Backup your layout

Go to Layout -> Edit HTML. Click on Download Full Template. Save it giving some name to remember what you are about to do.

3. Expand Widgets

Check the box namd Expand Widget Templates.

4. Lets start

If you are using Layout, just follow the instructions.

5. Adding a style

<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>


Your style sheet is usually near the top of your template, between the <style> and </style> tags. If you don't have style tags, just make sure you add in the <style> tags around them. I placed this just above the <b:skin>.What we did here was to define a class called "fullpost" that will appear only on post pages (permalinks).

6. Getting the Adsense Unit

Go to your Adsense page.

Create a new Adsense for Content unit. Better make it thin (width near that of the post width and height 60).

Copy the Adsense Unit Code.

7. Placing the Ad

Add the following code to your template, just before <data:post.body/> tag:

<b:if cond='data:blog.pageType == "item"'><br />
[ The Adsense Unit Code Goes Here ]
</b:if>


The Adsense Code is executed only when the Page Type is item, i.e., Post Page.

FINISHED !!!

References

1. Blogger Help

2. Adding HTML Code snipet inside post

3. Colorized HTML


ATOzTOA : Latest Headlines


2 comments:

manger said...

VERY NICE PLACE TO AD

http://gjewelry.com/

Post a Comment