How to make an ad slot before and after the contents of the post | Droinur123

Welcome to the Droidnur123 blog Yesterday someone requested "how to make an ad slot before and after the contents of a post on Blogger." Actually, the method is very easy, but for those of you who already know-how, you no longer need to follow this method because you have done this method before.

For those of you who want to display ads, be it banner ads or special AdSense ad units such as In-article Ads in posts, you can follow the method below.

How to make an ad slot before and after the contents of the post?

As Usual, First, open the Blogger dashboard > click the Theme menu and Edit HTML next customize  > Find this code below in the template

<data:post.body/>

Or maybe like this

<p><data:post.body/></p>

More precisely, look for the code <data:post.body/> inside this markup

<b:includable id='post' var='post'>
....
....
<data:post.body/>
....
....
</b:includable>

If in your template you have some code, <data:post.body/> look for the code wrapped in a post page conditional tag. Examples like this 

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
</b:if>

It can also be replaced with the Latest Blogger Conditional Tag format.

If it's not there, you just need to add a new code like this

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
</b:if>

Then add the code below to wrap the banner or ad code

<b:if cond='data:blog.pageType == "item"'>
<div class='kabaradd qu'>
<!-- Your Ad Here -->
</div>
<data:post.body/>
<div class='kabaradd'>
<!-- Your Ad Here -->
</div>
</b:if>

Replace the marked code with your banner or ad code. An example like this, here I use the AdSense In-article code 

<b:if cond='data:blog.pageType == "item"'>
<div class='kabaradd qu'>
<ins class='adsbygoogle' data-ad-client='ca-pub-xxxxxxxxxxxxx' data-ad-format='fluid' data-ad-layout='in-article' data-ad-slot='xxxxxxx' style='display:block; text-align:center;'/>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});         
</script>
</div>
<data:post.body/>
<div class='kabaradd'>
<ins class='adsbygoogle' data-ad-client='ca-pub-xxxxxxxxxxxxx' data-ad-format='fluid' data-ad-layout='in-article' data-ad-slot='xxxxxxx' style='display:block; text-align:center;'/>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});         
</script>
</div>
</b:if>

You Need to Also add the CSS code below before </head>or&lt;/head&gt;&lt;!--<head/>--&gt;

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
.kabaradd{margin:20px auto 0 auto}
.kabaradd.qu{margin:20px auto}
</style>
</b:if>

All Done, click the Save theme button in the template HTML editor.

Those are tips from Droidnur123 on How to Create Ad Slots Before and After Content Posts on blogger. Hopefully useful. Thanks For Visiting Keep Visiting Our Website.

Go to Link