September 27, 2017

Wrap Google Adsense Code Around Post Body Blogger Blog


Are you trying to figure out how to Wrap Google Adsense Code Around Post Body Blogger Blog.

You will agree with me when I say most of the tutorials in Google do not correctly answer this. I read every article and post related to it and could not find any easy way to wrap ad sense codes in Blogpost blog. 

The method which I am going to show you is completely accepted and standard. We will not be altering any ad codes instead contain it in a widget class making it possible to wrap the post text around it.

Wrap Google Adsense Code Around Post Body

Benefits To Wrap Google Adsense Code Around Post Body

Major benefit of Wrapping Google Adsense Unit Around Post Body is the increase in CTR rate. The Click Through Rate is the rate of clicks that you get divided by number of impressions. Read more here.

There are many helpful tutorials out there to generate ad sense codes. So I am not going to repeat them to make my blog post lengthier. 

I am assuming that you already have ad sense ad codes.

Here is A Google Adsense code / demo code / html code sample Example

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- adname -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-XXXXXXX"
     data-ad-slot="1234567"
     data-ad-format="link"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Let us start.

How To Wrap Google Adsense Unit Around Post Body Using CSS and HTML

You need to add only 2 codes to the blogger template to make it work. First a CSS code and the next is a HTML code. So it will be a clean installation and no need to edit or remove any existing codes.

Adding CSS Codes Above Skin tag

Copy the below CSS code.

.adsenseads {float: left;padding: 12px;}
  1. Open Blogspot
  2. Go to Theme
  3. Select Edit HTML
  4. Find ]]&gt;&lt;/b:skin&gt; tag using CTRL+F
  5. Add the CSS code above the skin tag
  6. Save the Template.

Check the Video On How to Find ]]&gt;&lt;/b:skin&gt; tag using CTRL+F in Blogger Blog




This will show ad sense code in the left side of the post. If you want to show it in the right side, replace left with right.

How to Add Google Adsense Code to Your Site

Copy the below HTML code in a notepad

&lt;div class="adsenseads"&gt;
Add Adsense script here
&lt;/div&gt;


How to Paste ad code on Blogger

Replace "Add Adsense script here" with ad codes that you got from ad sense ad page.
  1. Open Blogspot
  2. Go to Theme
  3. Select Edit HTML
  4. Find &lt;data:post.body/&gt; tag using CTRL+F [If you find two or more &lt;data:post.body/&gt;, tags use the Inspect in Chrome browser to identify the correct one. I have put a video tutorial below.]
  5. Add the HTML code above the &lt;data:post.body/&gt; tag
  6. Save the Template.
  7. View your website
You can add in-feed ads, Text &amp; display Ads and In-article ads using this method. But not link ads.

Inspect in Chrome browser to identify the &lt;data:post.body/&gt; tag



Kindly spend 5 seconds to share this post



Search Here

Whats Hot

About Author