[Guide] Adsense Ads Automatically After First Paragraph/Heading Tag in Blogger

Adding Adsense ads between blogger posts automatically was never been this easy. Now we have similar ads placement of WordPress in blogger.



You may already know adding ads below the title and after the end of the post. or middle in blogger posts. And if not consider making a request in comments.

So using this guide you will able to add any adverts in every post automatically.  After first, second, third h2 /h3/ h4 or After first, second, third paragraph - much possibilities.

We will guide how you can set displaying Adsense or other ads automatically between of post. You can choose where such as,

› Just after the first paragraph.
After a specific number of a paragraph. i.e. after 2nd or 3rd paragraph.

› After Heading tags ( H2, H3, H4)
You can set this numbers too, i.e, to show at second H2 tag.


To doing this just follow steps below.

How to Display AdSense Ads just after the First Paragraph


Step 1. Sign in blogger.com opens your blog on which you want to place Ads between in post. Navigate to Template and Click EDIT HTML option. It will open blogger HTML Editor now press CTRL+F to search <data:post.body/>

Keep in Mind - That You will find  many <data:post.body/> , Find the Second one. And if this didn't work, you need to find the correct Tag, By checking another <data:post.body/> Tags. In some templates it is near to tag itemprop='articlebody'>.

If you still can not find the right Tag, Make a comment below and we'll look for the correct code of your blog template.

step 2. When you find that Tag, replace that with the following code:

<div id='quickfever-target'><data:post.body/></div>

[ example ] 
before - <data:post.body/>
after - <div id='quickfever-target'><data:post.body/></div>

Stpe 3. Open Adsense.com or other Ad network and copy any Ad code and convert it into plain html now copy converted Ad code and replace "CONVERTED ADS CODE HERE" text with it - in the below code.

Now you need to copy below Code and place it Just before <div id='quickfever-target'><data:post.body/></div> line.

Code type 1. - Simple Ad style. ( 


[<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='quickfever-content' style="display:inline-block;float: none">CONVERTED ADS CODE HERE</div></b:if>]

Code type 2. - Customized, Best if you want your Account SAFE.


Displaying/Align Ads on the Right Side.

<div id='quickfever-content' style='display: inline-block;float: right;margin:10px 0 0 15px;background: #fff url(http://i.imgur.com/mBbv90p.png) no-repeat top right;padding-top: 9px'>CONVERTED ADS CODE HERE</div>

Displaying/Align Ads on the Lest Side.

<div id='quickfever-content' style='display: inline-block;float: left;margin: 0 15px 0 0;background: #fff url(http://i.imgur.com/mBbv90p.png) no-repeat top right;padding-top: 9px'>CONVERTED ADS CODE HERE</div>

Displaying/Align Ads on the none Side. (works same as right side, but no space between ad and post content)

<div id='quickfeverads-content' style='display: inline-block;float: none;margin:0 0 0 0;background: #fff url(http://i.imgur.com/mBbv90p.png) no-repeat top right;padding-top: 9px'>CONVERTED ADS CODE HERE</div>

Undrestanding this Code, And Customizing it ( type 2 Code)

float: center - This CSS used for displaying ADS as center,
You can replace none with left or right ( if you are using 300x250 or Similiar Box) use center if you are using any banner size Ads.

margin: change the value to make a space between post content and Ad.

example of right side Ad margin [margin:10px 10px 10px 10px;]
this will result a space from every side.
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 10px;

Like if you are set Float: right setting you need to change its opossite side magin code (margin-left) to atleast 15px to be safe.


To be safe, use advertise tag with ADS.

background: #fff URL(PASTE YOUR CUSTOM IMAGE TAG) no-repeat top right;
padding-top: 9px
use this to correctly display the advertising image above Ads.
top right - change it to 'top left' to display the advertising tag on the right side of the Ad.

Screenshot of what it will look like in you template - example:





Step 4. lastly, right after <div id='quickfever-target'><data:post.body/></div>  (step 2), place this script to load the Ads.

[<script type='text/javascript'>
function insertAfter(addition,target) {
var parent = target.parentNode;
if (parent.lastChild == target) {
parent.appendChild(addition);
} else {
parent.insertBefore(addition,target.nextSibling);
}
}
var adscont = document.getElementById(&quot;quickfever-content&quot;);
var target = document.getElementById(&quot;quickfever-target&quot;);
var linebreak = target.getElementsByTagName(&quot;br&quot;);
if (linebreak.length &gt; 0){
insertAfter(adscont,linebreak[0]);
}
</script>]

How to Display AdSense Ads after H2, H3,H4 Tag


If you would like to insert/add after a number of paragraphs like after 2/3rd, 4th you just need to change '0' to any number e.g. 2/3/4


Step 5. Click "Save template" to save the changes and you're done.

With this trick, you can insert AdSense after the first paragraph automatically in Blogger with ease. Now it's your turn to decide which format works best on your site.


Example of Full Code


If you want a ready-made script that you just need to replace with <data:post.body/> and replace "CONVERTED ADS CODE HERE" with converted Ad code

Adsense Ad aligned RIGHT and show after H2 Tag / Advertise tag just to be safe.


<div id='quickfeverads-content' style='display: inline-block;float: right;margin:40px 0 0 10px;background: #fff url(http://i.imgur.com/mBbv90p.png) no-repeat top right;padding-top: 9px'>CONVERTED ADS CODE HERE</div>
<div id='quickfever-target'><data:post.body/></div>
<script type='text/javascript'>
function insertAfter(addition,target) {
var parent = target.parentNode;
if (parent.lastChild == target) {
parent.appendChild(addition);
} else {
parent.insertBefore(addition,target.nextSibling);
}
}
var adscont = document.getElementById(&quot;quickfever-content&quot;);
var target = document.getElementById(&quot;quickfever-target&quot;);
var linebreak = target.getElementsByTagName(&quot;h2&quot;);
if (linebreak.length &gt; 0){
insertAfter(adscont,linebreak[0]);
}
</script>

So this is how you gonna generate revenue according to your site's max potential. We demonstrated adsesne you can also try these Adsense alternatives and can read about AdSense approval and tips here

If you want any kind of help regarding this article, comment below. :)

0 Komentar untuk "[Guide] Adsense Ads Automatically After First Paragraph/Heading Tag in Blogger"

Back To Top