Adding Adsense Ads to blogger (blogspot) Template

After a long while I again need to put adsense ads to blogger template. and again I forgotten the little trick to put Adsense code to blogspot I learnt. I just remembered the quote to encode. But it is not sufficient. Blogspot Template when saved remove the JavaScript code put inside <script></script>.

Blogger/Blogspot Img

For putting the Adsense code inside HTML/JavaScript widget, just copy the Adsense code inside widget. But for putting it inside template you need to do something extra which is explained below.

So, here is the method of putting Adsense code inside blogger/Blogspot template:-

Suppose, this is my actual Adsense Ads code:

<script type="text/javascript"><!--
google_ad_client = "ca-pub-4441905138518539";
/* ViewBelowPost */
google_ad_slot = "5574336870";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

If I try to put directly inside the blogger template, it will become like this in HTML source code after save:

<script type="text/javascript">
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

As you can see this is not the correct code for Adsense.

Solution:

Copy your Adsense code and paste it here on htmlencode tool. Remember to 'Uncheck' the "Do not convert " and ' characters" checkbox. You need " and ' converted.  Press convert and copy the encoded code and put it on your blogger/BlogSpot template.

The tool will output code like this:

&lt;script type=&quot;text/javascript&quot;&gt;&lt;!--
google_ad_client = &quot;ca-pub-4441905138518539&quot;;
/* View-inPost-belowTitle */
google_ad_slot = &quot;8859642242&quot;;
google_ad_width = 468;
google_ad_height = 60;
//--&gt;
&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;
src=&quothttp://pagead2.googlesyndication.com/pagead/show_ads.js&quot;&gt;
&lt;/script&gt;

You are seeing it correctly. It looks strange but it is the kind of code that work there.

Important points:

  • If you are doing it first time then you may find it difficult to do.
  • Blogger template is different kind of XML template so many times the place you are putting your code is not correct. Try putting any normal text like "test" etc and see it is coming correctly on preview. If it is coming correctly on preview then it is the place you can put your AdSense code.
  • After doing everything correctly, check your blog HTML code. In Firefox, press Ctrl +u. If the code you see is exactly the same as you got from Adsense (without encoding) then everything is correct from your side.
  • Now, you are sure you have done everything correctly then wait for few hours or days depending on your blogs visitors count. If you just created your blog then it can take time.