How to Add AdSense Code to Your Blogger Blog’s Template [Dummies Guide]

Starting up a blog and getting an idea of earning through it is a fantastic thing and I appreciate you coming up with it. I know you are new to blogging and Google AdSense, but you need to worry when there are articles on Amfas Tech to guide you get started with good speed.


Coming to the current topic, adding AdSense ad code to the template will create a permanent place on your blog’s layout to display ads. You may add the code anywhere in your template but make sure it doesn’t dominate or push down the content from the above the fold.

Take a look at the following examples given in official Google support answers,

Keeping them in mind and follow the instructions to add the ad code to the template,

Step 1: log into your Google AdSense account
Step 2: Click on My ads > +New ad unit
Step 3: Choose the type of ad unit and style, give the unit a name and click Save and get code.

Note: Copying and pasting the code directly into the template is not valid. You need to parse the code before pasting it into the template.

What is parsing?

According to Wikipedia,

Parsing or syntactic analysis is the process of analyzing a string of symbols, either in natural language or in computer languages, according to the rules of a formal grammar. The term parsing comes from Latin pars (orationis), meaning part (of speech).”

To speak it in English. parsing is nothing but converting the string of symbols in HTML into the browser understandable format. For e.g., ‘<’ symbol in HTML is parsed as ‘&lt;’.

How to parse?

There are several HTML parsers available on the internet that can do the work for you in the blink of an eye. Among them, the following are some of the good parsers that always stay top in SERP.

Adding parsed code to the template

If the unparsed code looks like this,

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!—NAME OF THE AD UNIT-->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-XXXXXXXXXXXXXX"
     data-ad-slot="XXXXXXXX"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
The parsed version of it looks like as follows,
&lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
&lt;!—NAME OF THE AD UNIT--&gt;
&lt;ins class=&quot;adsbygoogle&quot;
     style=&quot;display:inline-block;width:300px;height:250px&quot;
     data-ad-client=&quot;ca-pub-XXXXXXXXXXXX&quot;
     data-ad-slot=&quot;XXXXXXXX&quot;&gt;&lt;/ins&gt;
&lt;script&gt;
(adsbygoogle = window.adsbygoogle || []).push({});
&lt;/script&gt;

If you wanted to add the ad code under the ‘title’ or ‘body’ of the post, follow the instructions as given in this tutorial.

If you wanted to add the ad code in elsewhere of the blog’s template, use inspect element feature of your web browser, identify the section you wanted to place ads and go to Template > Edit HTML section of your dashboard, find the section in the code and paste the parsed Ad code right there and Save template.

Tip: Always place the code in between <div> ADSENSE PARSED CODE </div> tags to avoid messing up of Ad unit with the blog template. For e.g., it looks like as follows,

<div>
&lt;script async src=&quot;//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js&quot;&gt;&lt;/script&gt;
&lt;!—NAME OF THE AD UNIT--&gt;
&lt;ins class=&quot;adsbygoogle&quot;
     style=&quot;display:inline-block;width:300px;height:250px&quot;
     data-ad-client=&quot;ca-pub-XXXXXXXXXXXX&quot;
     data-ad-slot=&quot;XXXXXXXX&quot;&gt;&lt;/ins&gt;
&lt;script&gt;
(adsbygoogle = window.adsbygoogle || []).push({});
&lt;/script&gt;</div>

Hope that helped.

0/Post a reply/Replies

Previous Post Next Post