Blogspot How to: Add Adsense Below Post Titles

Google Adsense is the most popular ad network on the planet. A lot of Blogger users also use it. It's an endless discussion where to place these ads on your blog for maximum exposure. The best ad places are around the header or above the posts or below the post titles. You can easily add adsense in your sidebar as a gadget. But Blogger doesn't allows us to directly place the ads below post titles. The ads below post titles have proven to be one of the most successful money making positions. So, what are you waiting for? Follow this tutorial to add your Adsense ads below post titles.

Please Note: I'm assuming that you're using the new Adsense interface.

Steps!

1. Log in to your Google Adsense account by going to https://www.google.com/adsense/
2. Go to My ads tab and open Ad units from the left side by expanding Content link.[View Screenshot for Help]
3. Click new ad unit to create a new ad.[View Screenshot for Help]
4. Select the size, type and color of your ad. For best results chose either 300x250 medium or 336x250 large rectangle.[View Screenshot for Help]
5. Give your ad a remember-able name and ad a custom channel to track the ad performance. If you don't know anything about channels then leave that option.
6. After filling required information, click save and get code button at the bottom of the page.[View Screenshot for Help]
7. A pop-up window will appear with the ad code. Copy that code.[View Screenshot for Help]
8. Before pasting the ad code in Blogger, we must make it compatible with Blogger format. So go tohttp://www.hacktrix.com/adsense-code-converter/ paste the ad code and convert it. You'll find the converted ad code in the bottom box there. Copy the converted ad code.
9. Open your Blogger account and go to Design then Edit HTML tab and check Expand Widget Templates option.
10. Press Ctrl + f & find <data:post.body/> you'll see some code like this:

    <div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

1. Paste the converted ad code just before the above code. The result would look something like this:

<script type="text/javascript"><!--
google_ad_client = "ca-pub-xxxxxxxxxxxxxxx";
/* my ads */
google_ad_slot = "xxxxxxxxxx";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

1. Click the PREVIEW button to see the result. Thought you might not see ads below post titles instantly because sometimes Adsense ads take some time to display.
2. After that save your template by clicking the SAVE TEMPLATE button.

Tip: Make Ads Appear Only on Post Pages

Usually, users don't like to see too many ads on a single page. So, we can hide the ads under post titles on main page. These ads will appear only when users will click the post title and go to the post page. To do that follow the steps above but after step 8 you have the converted ad code. Ad some more code in that converted code so that it should look like this:

<b:if cond='data:blog.pageType == &quot;item&quot;'><script type="text/javascript"><!--
google_ad_client = "ca-pub-xxxxxxxxxxxxxxx";
/* my ads */
google_ad_slot = "xxxxxxxxxx";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></b:if>

1.) If you want to show your Google Adsense ad below post tile to blogger in the left side then copy the below Code 1.1,

Code 1.1

<div style="float: left; margin: 10px 10px 10px 0;">
YOUR ADSENSE CODE HERE
</div>

 OR

2.) If you want to show your Google Adsense ad below post tile to blogger in the right side then copy the below Code 1.2,

Code 1.2

<div style="float: right; margin: 10px 0px 10px 10px;">
YOUR ADSENSE CODE HERE
</div>

OR

3.) If you want to show your Google Adsense ad below post tile to blogger in the center then copy the below Code 1.3,

Code 1.3

<div style="text-align: center; margin: 10px 10px 10px 0;">
YOUR ADSENSE CODE HERE
</div>

What I did here is that I've added an if condition to make the ads appear only on post pages. After that, follow the steps above to complete the tutorial.