18.1.14

How to place adsense ads within post body without parsing the code in blogger

4 comments
Lets see how to add Google Adsense ads within post body without parsing the ad code and within Google Adsense Policy.

Adsense by Google is one of the most popular online monetizing service online. A lot of bloggers around the world is taking advantage of Adsense, some are even dependent totally on Adsense income for their living. Blogger is a free blog publishing platform also by Google.
Placement of ads on blog or website is an important customization for increasing revenue from advertising. Blogger allows adding adsense ads directly via adsense widget and/or via HTML/Javascript widget in the sidebar, between two posts, header and footer of the blog. Unfortunately there is no direct option for placing adsense ads within the post body on blogger.
Advertisement within the post body, yields a high CTR (Click Through Rate) and increase the revenue. The reason being, the ads within the post body gets maximum exposure to your blog audience, this is the reason, most of the successful big publishers like mashable and many other websites.
In blogger, the ads can be placed in the post body by manually editing the HTML template of the blog. With the new code and ad modification policy, you do not need to worry about parsing the ad code. The code can be used without parsing and within Google adsense ad code policy.

The ads can be placed in these positions within postbody. Lets say Ad No. 1, 2 and 3.

ad position within post body

Follow these steps to add the ad

1. Creating The ad div container.
2. In your blogger dashboard, go to Template → Edit HTM and Now search for.
<b:includable id='post' var='post'
and expand it and locate
<div class='post-body entry-content'
or directly search post-body entry-content (remember, this will appear twice in the template, once for mobile-post and once for post. You need to go to the post one which is usually comes on second number)
3.Now locate this code
<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'>
<data:post.body/>

4. Make a div container with your desired id just above the data:post.body for example
<div id=’ads5’ style=’your css style’><---ad code---></div>

B. Getting the ad code.

1. Go to your adsense dashboard → My ads.
2. Create a new adsense ad unit. There are 2 types of codes available in the adsense. The new asynchronous code and old synchronous code. You can use either of the two.
3. For async code, there is no need to do any modification. Just change async in the code with async='async' (async='async' is the async equivalent in XML and is not considered as code modification).

async adsense code
How to use the async adsense code

synchronous adsense code
Synchronous adsense code
4. For synchronous code you have to modify the code according to acceptable guidelines of Google. See the figure to understand the details. you have the remove the parts of the code highlighted in red color. This modification is called Ad tag minification and is approved by Google. For more details read this.

Lets see few examples

1. For placing the ad in position 1 (floating to right) of above image.
<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'> 
<div id='ads1' style='float:right;'><-- Your Ad code for placing the ad in Ad Position 1 of above image --></div>
<data:post.body/>

2. For placing ad code at position 2 (floating left).
<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'> 
<div id='ads2' style='float:left;'><-- Your Ad code for placing the ad in Ad Position 1 of above image --></div>
<data:post.body/> 

3. For placing ad at position 3 (below the post body)
<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'>
<data:post.body/> 
<div id='ads3' style='float:right;'><-- Your Ad code for placing the ad in Ad Position 1 of above image --></div>

If you want to show ad only on the post page, you can do so by using condition tag of blogger.
<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'> 
<b:if cond='data:blog.pageType == "item"'>
<div id='ads1' style='float:right;'><-- Your Ad code for placing the ad in Ad Position 1 of above image --></div></b:if>
<data:post.body/>

You can also use other styling like border with 'border:1px solid grey;' or for background color etc.

Google has recently released a new FAQs on Adsense program for publishers, you can read it here for clearing your doubts. https://support.google.com/adsense/answer/3394713#1

To read more about Adsense policy and to get yourself acquainted with it you can read these.
http://adsense.blogspot.in/2013/05/join-our-policy-refreshers.html

If you come across any problem in implementation, feel free to ask in comments.

4 comments:

  1. This comment has been removed by a blog administrator.

    ReplyDelete
  2. Is it a violation to place ads halfway down within the body of your post?

    ReplyDelete