If you want to use Google Adsense in middle of post or some other ad unit to appear after certain paragraph, it is now possible on Blogger. Author “A J Banda ” created an awesome script to make it possible. This script actually look for number of <br /> (line break) tags inside your post and display ad unit. You can define number of <br /> (line break) tags to display ad unit at right place where you want to see it. Such similar feature is already with WordPress, Joomla but Blogger was lacking for long time before creation of this script. We are providing you this code with the help of “A J Banda” but it is slightly different from his code which is available on his site.
What is additional?
1. Reduced the need of <br /> (line break) tags in his code and using css style “clear:both” for same purpose.
2. Modded this code for center alignment by using HTML5 properties.
3. Add XML code which will load only on Blogger item page rather than loading on other pages to save your blog performance.
Injecting this code to Blogger template
Now I will discuss how to install/ integrate/ inject this script in your blogger template. (!) Must take backup of your template before making any change.
1. Find <head> tag in your blogger template and place latest jquery just below it. Please avoid to use two jquery links, remove older one and use new version.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" ></script>
2. Second look for this code <data:post.body/> inside your template and replace it with the following code –
<div id="PostBody"> <data:post.body/> </div> <div id="AdCode"> <div style='margin:5px 0;text-align:center;clear:both;'> <!-- Ad Unit Code Here --> </div> </div>
New Blogger template may have 2 or 3 <data:post.body/> code. You should have to identify correct one. Generally 2nd instance of <data:post.body/> is right code to replace in new blogger templates.
<b:if cond='data:blog.pageType == "item"'> <script> $AdCode = $("#AdCode").html(); $("#PostBody br:lt(1)").replaceWith($AdCode); $("#AdCode").remove(); </script> </b:if>
4. Save the changes in Blogger template and have fun.
You can choose your Ad location –
By replacing the value br:lt(1) with br:eq(n), where n= 1, 2, 3… which is number of line breaks after which Ad will appear in your post. e.g. If you want to show Ad after 5th line break then replace br:lt(1) with br:eq(5) and you are done.
To parse the Adsense code to use within Blogger template, please follow this link – https://www.techprevue.com/postable-share-the-source-code/
GitHub gist – https://gist.github.com/vinayprajapati/5893386
Reference – 1. http://www.ajibanda.com/2013/04/place-google-adsense-ads-within-your-post-in-blogspot.html