How to Wrap AdSense Ads Around and Inline Beside Blogger Post Content

When you look to the top left corner of this article, there is a Google AdSense ads unit block that has a style that is aligned inline beside and wrapped the article body (only on single post view). This format of layout is considered and proofed to be able to generate higher CTR (click through rate) for AdSense ads, directly increasing the revenue publisher earned. The new Blogger service with widget-based XML template allows authors at best to insert AdSense ad blocks in between blog posts by using AdSense or HTML/JavaScript page elements, but not inline within and wrap around blog post itself.

Here’s the trick and hack on how to put AdSense ads in within and beside of Blogger.com blog post body, and has the content wraps around the ads to make the ads look like part of the content. Coupled with using ad colors which blend the borderless ads to the blog overall color scheme, and choosing bigger ad format such as 336×280 large rectangle or 300×250 rectangle will definite optimize placement of AdSense ads, increase ads click thru rate and improve publishers income. Beside, the AdSense ads put in by this trick will also be shown and displayed in the blog main page, or when individual blog post content page is visited.

  1. Login to Blogger account.
  2. At Blogger Dashboard, click on Settings link listed behind “Manage” for the blog that you want to enable to show AdSense ads between posts.
  3. Click on Template tab, and then click on Edit HTML sub-tab link to open Blogger HTML code template editor to edit the contents of your template.

    Blogger Edit HTML

  4. Backup a copy of your template by click on Download Full Template link, in case it’s is needed be uploaded to Blogger server to recover the template in the event of mistake or corruption.

    Blogger Download Full Template

  5. Click to tick the Expand Widget Templates checkbox.

    Blogger Expand Widget Templates

  6. Seach for the following line in the new Blogger template HTML code in the text box:

    <data:post.body/>

    or

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

    Blogger Expand Widget Templates

  7. Append the following lines of code into the template BEFORE the line of <data:post.body/> located above:

    Parsed Google AdSense Ad Code (guide to parse the HTML code of AdSense JavaScript with escape character)

    AdSense Ad Code in Blogger Template

    Note the above code will align AdSense ad block to the left. You can also make it make it float to the right, but change the “float: left;” to “float: right;”.

    Note that you can also make the ads appear only on single post view.

  8. Click on SAVE TEMPLATE button when done.

If the alignment of your blog layout is not good, you can try to add the code above directly after the following line in the Blogger widget template:

<div class=’post-header-line-1′/>

The above trick may work to add ad code wrap beside the post content in Blogger from other advertising networks too, such as AdBrite, BlogAds, Chitika, Tribal Fusion, ValueClick, and etc, in case you can’t use AdSense for reason such as account banned. And there are more position inside posts to put AdSense.

Update: Blogger can also add AdSense ads inside post using Ads Between Posts trick.

Share and contribute or get technical support and help at My Digital Life Forums.



14 Responses to “How to Wrap AdSense Ads Around and Inline Beside Blogger Post Content”

  1. Place AdSense Ad Unit In Various Positions Inside Within Blogger Post Contents » My Digital Life
    September 23rd, 2007 18:22
    1

    [...] is trick to add Google AdSense and other advertising network such as AdBrite ad unit right beside and inside [...]

  2. How to Display Elements (Ads) Only On (Or Only Not At) Individual Single Post Item View » My Digital Life
    October 3rd, 2007 01:15
    2

    [...] it won’t be shown on homepage, label or category pages, or archive pages. For example, while wrapping the AdSense ads manually beside the post content, you can make the ads displayed only when individual posts are viewed by adding above 2 lines to [...]

  3. asterix
    October 31st, 2007 18:13
    3

    editing the google adsense code violate google terms ??? isnt it ? is it safe to use the above method

  4. Hye
    December 13th, 2007 16:41
    4

    Hello. Is it okay to use the codes above. Will it not violate the Adsense TOS? Please reply. Thanks.

  5. admin
    December 13th, 2007 16:59
    5

    After you use the parsed code above, when you view source HTML code, the adsense ad code is exactly the same as you see in AdSense account. So effectively there is no change at all.

  6. rara
    December 17th, 2007 10:24
    6

    this works for the beta blogger, but how about for the old blogger? will this work too? how?

  7. debashish
    January 30th, 2008 00:02
    7

    Hi i tried to add ads between post by editing the blogger posts but unsuccessful.Message was” Try to remove the errors from this page” while trying to save the changes.

    Help please!!

  8. Ben
    April 1st, 2008 23:29
    8

    @debashish

    This will only work on blogger classic, looks to me like the error you mentioned is from trying to use this on Blogger with Templates (or blogger beta/new blogger)

    Is there a way to get this to work on blogger beta

  9. Michael Miles
    April 14th, 2008 11:31
    9

    Thanks for this article. I’ve being going nuts trying all sorts of things to get the text to wrap around my adverts, but it was this article that finally cracked it. It’s so simple when you know how. THANKS!

  10. hannah
    August 1st, 2008 13:16
    10

    i followed each and every step but why is it that the adsense ad is not wrapped in the text. it’s aligned on the left instead and above the post.

    what i want is to have the text around the adsense ad

    Please help..
    thanks

  11. Andy
    August 29th, 2008 00:44
    11

    Thanks dude..it work..

  12. 13 Most Wanted Google Adsense Optimization Tips | K-Director.com
    September 8th, 2008 23:13
    12

    [...] How to Wrap AdSense Ads Around and Inline Beside Blogger Post Content [...]

  13. seo
    September 26th, 2008 11:20
    13

    好 支持 写的不错

  14. Money Starts Now.com » Get Adsense Traffic - Part 2
    October 9th, 2008 08:24
    14

    [...] by selecting the rectangular 336×280 “adsense for content“ ad from adsense, and placing it only once in “Blogger” using this guide, so that the ad blends in with the [...]

Leave a Reply

You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Subscribe to comments feature has been disabled. To receive notification of latest comments posted, subscribe to My Digital Life Comments RSS feed or register to receive new comments in daily email digest.
Custom Search

New Articles

Incoming Search Terms for the Article

Wrap Adsense Code Inside Blog Post - wordpress adsense wrap around post - floating adsense posting blogger - put adsense in post inline - ads beside content - html align left float adsense script - wrap adsense code - wrap adsense code around text in blogger - wrap text in google ads - add adsense in between post content - Blogger how do I make text wrap around an ad - how do I make text wrap around an ad on blogger - wrapping adsense code - blogger adsense on every single blog - floating content in blogger - large rectangle adsense position blogger in post - wrap adsense blogger - how to create adsense in post in blogger] - how do I wrap text around amazon ad in blogger - how to add line between post in blogger - how to hack place adsense ads in blogger - html adsense video alignment - How to Wrap AdSense Ads Around and Inline Beside Blogger Post Content - how to display adsense ad inline with text - inline ad html code - wrap google ads in articles - wrap adsense in content - how to add ads in post blogger - html wrapping adsense with text - most viewed post in blogspot blogspot hack - placing an adsense block in a blog post - how to wrap text around ads on blogger - in line adverts - inserting adsense in single posts blogger -