How To Embed Adsense Ads In Blogger Posts

Often, we want to embed our Adsense code at the desired place in and around our blogger post. Novice bloggers with little or no knowledge of CSS may find it difficult to place the Adsense ads at the desired place. Blogger has limited options and place your ads at predetermined positions. For example, if you want to place an ad just below the heading of your post, it does not give you that liberty to do it. If you will try to put the code in your post from within the post editor, it will not work at all and will appear as plain text in your post. There are few simple techniques that enable you to place these ads at the location you want it to appear.

Save your template

Before implementing any changes in your template, it is very important to save it. In case some mishap occurs you can easily restore your original template. To save your blogger template first go to Layout tab and select Edit HTML sub-tab. Click the Download Full Template link and save the template on your PC.

Step by step procedure

Generate the Adsense code from your account and open the Ad Parser. Paste the ad code in the box and press Parse button. Copy the parsed code and save it in any text editor. The parsing process is very simple and is based on 3 simple replacement rules.


1) < is replaced by &lt;
2) > is replaced by &gt;
3) " is replaced by &quot;

After parsing your ad code will look some thing like this.

&lt;script type='text/javascript'&gt;&lt;!--
google_ad_client = &quot;pub-xxxxxxxxxxxxxxx&quot;;
/* 468x60, created 2/4/08 */
google_ad_slot = &quot;xxxxxxxxx&quot;;
google_ad_width = 468;
google_ad_height = 60;
//--&gt;
&lt;/script&gt;
&lt;script src='http://pagead2...../pagead/show_ads.js'
type='text/javascript'&gt;
&lt;/script&gt;

For placing ad above or below your post header, find the following line in your template.

<div class='post-header-line-1'/>

Paste the code above this line, if you want to show your ad above post header. For showing the ad below post header, simply place code just below this line.

For placing the ad at the end of your post body, find the following line in your template.

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

Paste the code below this line, to show your ad right at the end of your post.

To align the ad on left, right or middle, you can surround your ad code with following tag.

<p align="center">
Your Ad code
</p>

Note: /* Replace "center" with "left" or "right" for desired alignment */

By using this technique you can easily place your Adsense ad at your desired place. I hope this information will be useful for you. If you face any problem, feel free to contact me.

Digg this Add to del.icio.us Stumble It! Mixx It! Sphinn It!

Want to make sure you always get the latest updates on MintBlogger.com? It's totally free! Sign up, and we'll send the articles straight to your inbox. No spam, ever. Period.

Free Updates by Email Free updates by RSS (What is RSS?)

The Ultimate Premium Wordpress Theme

Building a website was never the same with new Thesis 1.6. The Thesis Theme for WordPress is a high-quality template system that you can use to improve your site immediately.

• Strong SEO - Expertly-coded HTML + CSS + PHP framework makes Thesis the strongest engine to power on-site SEO. The core SEO settings are activated automatically, the moment you install thesis on your website. Just set it and forget it. Check out Thesis SEO features now!


• Flexible Design Options - With Thesis in your hand, you don't need to hire a web-developer to design your website or blog. Thesis killer design options gives you complete control over every aspect of appearance, layout, color and typography. See Thesis Design Options now!


• Strongest Support Community - Thesis is supported by thousands of talented users ready to help you in forums. Stack of excellent video tutorials makes it easy to understand every concept in no time. Grab Thesis 1.6 Now!