How to Add Adsense Within a Post In Blogger

Blogger made it easier to embed Adsense using the gadgets. But they don’t have the automatic feature in embedding Adsense within the post. What I don’t like with this method is that, your blog really looks like a “NEWBIE” blog. We want our blogs to look like a professional blog while earning a good deal of income with the most effective monetization model.

It’s easy to add Adsense on the sidebar, in between posts, and even above the posts. But we want more than that. We want to ad Adsense within each post pages. Not in the archives, not in the home page, but within the post pages.

Fact: Most blogs who have used Adsense effectively places Adsense within the top and side portion of the posts below the header line.

With this, I tried my best to have a little research on embedding Adsense within the post matched with the text wrapping of the content of the post. Now, this is very tricky because not all methods of embedding Adsense worked for me. This is why I am very eager to make a post on this so that you can try it for yourself if this can work for your template.

Disclaimer: This method worked for me. If you follow this, it’s completely up to you but I don’t have any responsibility on your blog.

Step 1. Log to Your Blogger Account and Back Up Your Template. First things first; back up your existing blog. You can do this by simply following these instructions:

1.    Log-in to your blogger account.
2.    Click  Design
3.    Click Edit HTML
4.    Click Download Full Template

The Download will automatically start and save it to your PC. Please note that it is just an xml code. It’s not a virus, but it is composed of codes containing the template of your blog. After downloading you can simply check it by using Notepad or Gedit.

Step 2 Get the Ad Codes and Parse It. Open a new window and go to www.google.com/adsense. Login to your account and set up the best Ad that you want. I recommend that you use 300 x 250 px Ad within the content. Once you set it up, copy paste the codes to Notepad or Gedit (which I highly recommend than Notepad)

Now you need to parse the Ad codes. You will have to open a new window and Google it. But here’s the link that I used for parsing:  http://www.blogcrowds.com/resources/parse_html.php
Copy paste your Ad code to the space provided and click “Parse”. Your new code will look like this: 

Step 3. Add some codes. What I mean is, you will have to add a div tag codes to wrap it within the post. But if you don’t want to wrap it, leave it as it is. But I love to wrap Ads within the post. It gives more beauty and have a more professional look.  So your new code will look like this:

Note: Some blogs recommend other methods like modifying the CSS codes. But this one works for me.

Step 4. Embed the codes to your blog. Go back to “Edit HTML” (DON’T FORGET TO TICK THE EXPAND WIDGET TEMPLATE) then follow the instructions below:

1.    Ctrl-F. This will open the “Find Bar”
2.    Type in:   data:post.body
3.    Press Enter
4.    Click Next, until you find the “last”  data:post.body
5.    Once you find it, copy paste the code that you have parsed with the div tags just before the

In my case I have this code:

 Therefore you need to copy paste the parsed Adsense code in between to look like this:



Click “Save Template”

That’s it. You will be able to see your Adsense wrapped within the post.

Related Posts