How to Place AdSense Ads Below Post Title & Within Blogger Posts

How to Place AdSense Ads Below Post Title & Within Blogger Posts

Learn how to place AdSense ads strategically below the post title and within the content of your Blogger posts and increase ad revenue without widgets
Table of Contents

For over a decade, I've been helping Blogger users unlock their site's revenue potential. One of the most frequent questions I get is, "How do I put AdSense ads in the most effective spots—right under the post title and inside the article content?" Many creators believe Blogger is too restrictive for such precise ad placements, resorting to less effective, theme-dependent locations. I'm here to tell you that's a myth. With direct access to your template's code, you have complete control.

How to Place AdSense Ads Below Post Title & Within Blogger Posts: A Step-by-Step Guide

In this guide, I will walk you through a proven, template-agnostic method to insert AdSense ads precisely below your post title and at any position within your post content. This isn't about using unreliable third-party widgets; this is about understanding the structure of your Blogger template and placing the ad code exactly where it will perform best. By the end, you'll have a cleaner, more profitable layout that serves ads directly within the user's reading flow, boosting your RPM without compromising user experience. Let's dive into the technical steps that have consistently increased ad revenue for the blogs I consult on.

Prerequisites and Requirements

Requirements!To follow this guide, you will need: 
  • An active Google Account with a Blogger blog.
  • A Google AdSense account approved for live ads. You cannot use this guide with an unapproved account.
  • Administrative access to your Blogger dashboard (you must be the blog owner or an admin).
  • A basic comfort level with copying and pasting code snippets into your Blogger theme's HTML.

Understanding Blogger Template Anatomy: Key Data Tags

place-adsense-ads-below-title-within-blogger-post

Before we edit anything, it's crucial to understand two core Blogger data tags. Think of these as placeholders that the Blogger system fills in with your actual content when someone visits your page.

  • : This is the most important tag for our purposes. It represents the entire content of your blog post. Wherever this tag is placed in your template's HTML, your post's text and images appear.
  • : This tag outputs the title of your individual blog post.

Our strategy hinges on placing AdSense code adjacent to these tags. To place an ad below the post title, we'll insert code right after the title tag but before the body tag. To place an ad in the middle of the post, we'll need to split the body tag itself.

Pro Tip 1: Always Backup First
Never edit your live template without a backup. Go to Theme > Edit HTML, click the three-dots menu, and choose "Backup." Download this backup. If anything breaks, you can instantly revert to this saved version.

Step-by-Step Guide: Adding AdSense Below Post Title

  1. Access Your Blogger Template HTML
  2. Log into your Blogger dashboard, navigate to the left-hand menu, and click on "Theme." In the Theme panel, you will see a preview of your blog. Click on the three vertical dots (the "More Options" menu) next to the "Customize" button. From the dropdown, select "Edit HTML." This opens the raw HTML/XML document of your entire blog theme. A large text area containing all your code will appear.

    • Use the In-Editor Search: Press `Ctrl+F` (or `Cmd+F` on Mac) to open the search box within the code editor.
  3. Locate the Post Title and Body Tags
  4. You need to find the specific block of code that controls how your individual blog posts are displayed on post pages (not the homepage). In the search box, paste the following exact code snippet and press Enter: <data:post.body/>. The editor will highlight the first instance it finds.

    • Critical Context Check: Look at the code above the highlighted ``. You should see a tag like `

      ` or similar, and within that heading block, you will find the `` tag. This is the structure we need. It's vital you are working within a section clearly wrapped in a `` block, which is the template for each post.

  5. Insert Your AdSense Code Below the Title
  6. Once you've identified the `` tag and the `` tag in close proximity, you have found the right spot. Your goal is to place the ad code after the closing tag of the title section but before the `` tag. The exact placement might look like this in your editor:

    <h3 class="post-title entry-title" itemprop='headline'>
    

    <a expr:href='data:post.url'><data:post.title/></a>

    </h3>

    <!-- AD CODE WILL GO RIGHT HERE -->

    <div class="post-body entry-content" id='post-body-[ID]' itemprop='articleBody'>

    <data:post.body/>

    </div>

  • Get Your AdSense Code: Log into your Google AdSense dashboard. Go to Ads > By ad unit. Create a new "Display" or "In-feed" ad unit. Configure its size and style. After saving, AdSense will provide a JavaScript code snippet.
  • Paste with Precision: Copy the entire AdSense code block. Go back to your Blogger HTML editor and paste it exactly where you placed the comment (``). Save your changes by clicking the "Save theme" button.
Error 1: "Please correct the errors on this form."

If you see this error after saving, it's almost always because the AdSense JavaScript code contained a < or > symbol that Blogger's XML parser misunderstood. You must escape this code. Wrap your entire AdSense script in a CDATA section like this: <![CDATA[ ...your ad code... ]]>. Then try saving again.

Go to Your AdSense Dashboard to Create an Ad Unit

Step-by-Step Guide: Inserting AdSense Within Post Content

Placing an ad in the middle of your post is more dynamic. We will use Blogger's conditional tags and a little math to automatically split the post body and insert an ad after a specific number of paragraphs.

  1. Return to the Edit HTML Section
  • Go back to Theme > Edit HTML. You will be continuing work in the same area as before, focusing on the line containing ``.
  • Prepare Your Ad Code: Have a second AdSense ad unit code ready, preferably a different size or format (e.g., a 300x250 In-article ad) for variety. Escape it by wrapping it in a CDATA section now: <![CDATA[ ...your second ad code... ]]>
  1. Replace the Simple Body Tag with a Conditional Split
  2. You will replace the single `` tag with a more complex block of code. This code counts the paragraphs in your post and injects your ad after a specified paragraph. Find the exact `` line and replace it entirely with the following block:

    <b:if cond='data:blog.pageType == "item"'>
    

    <div expr:id='"post-body-" + data:post.id' class="post-body entry-content" itemprop='articleBody'>

    <div id='ad-position-1' style='float: right; margin: 10px; display: none;'>

    <!-- YOUR MID-POST ADSENSE CODE HERE -->

    </div>

    <script type='text/javascript'>

    var obj = document.getElementById('post-body-[ID]');

    var insert = document.getElementById('ad-position-1');

    if (obj != null && obj.getElementsByTagName('p').length > 4) {

    var p = obj.getElementsByTagName('p')[3]; // Inserts ad after the 4th paragraph

    if (p != null) {

    insert.style.display = 'block';

    p.parentNode.insertBefore(insert, p.nextSibling);

    }

    }

    </script>

    <data:post.body/>

    </div>

    <b:else/>

    <div class="post-body entry-content" itemprop='articleBody'>

    <data:post.body/>

    </div>

    </b:if>

  • Customize Two Critical Parts:
    1. Replace `[ID]` in both `expr:id='"post-body-" + data:post.id'` and `document.getElementById('post-body-[ID]')` with the actual ID from your original div. Look at the old `
      ` line and copy the 'xyz' part (e.g., `post-body-1234567890`).
    2. Replace the comment `` with your second, escaped AdSense code block.
  • Adjust Paragraph Number: The line `var p = obj.getElementsByTagName('p')[3];` inserts the ad after the **4th paragraph** (because counting starts at 0: `[0]` is the 1st para, `[1]` is the 2nd, etc.). To insert after the 2nd paragraph, change `[3]` to `[1]`.
  • Test and Save
  • Click "Save theme." Now, open one of your existing blog posts that has at least 5 paragraphs. The ad should now appear floated to the right (as per the `style='float: right;'` in the code) after the paragraph number you specified. It will only appear on individual post pages (`cond='data:blog.pageType == "item"'`) and not on the homepage, which is ideal for user experience and AdSense policy compliance.

    • Check on Mobile: Use Blogger's built-in mobile preview to ensure the ad displays correctly on small screens. You may want to adjust the CSS (e.g., change `float: right;` to `float: none; margin: 20px auto;` for mobile using a media query) for a better responsive experience.

    Troubleshooting 1: Ad Not Appearing in Middle of Post

    If the ad doesn't show, first check the browser's developer console (F12 > Console) for JavaScript errors. The most common cause is an incorrect ID in the getElementById function. Double-check that the ID matches the one in the div's expr:id attribute exactly, including the post-body- prefix. Secondly, ensure the post has enough <p> tags for the script to target.

    Optimization and Best Practices

    Placing the ads correctly is only half the battle. Optimizing them is key to maximizing revenue while keeping your audience engaged.

    Pro Tip 2: Prioritize User Experience & AdSense Policies
    ever place more than 3 ad units on a post page. Avoid placing ads too close to navigation elements. Most importantly, ensure ads do not mimic content (e.g., using a font/color that makes them look like part of your post links). Always comply with AdSense Placement Policies.

    Pro Tip 3: Experiment with Ad Formats & Placements
    The ad below the title performs best with a responsive 728x90 or 300x600 format. The in-content ad often performs excellently as a 300x250 rectangle. Use A/B testing available in your AdSense dashboard under "Experiments" to compare the performance of different ad units in these slots over a 30-day period.

    Ad Placement Recommended Format User Experience Consideration Estimated Impact
    Below Post Title Leaderboard (728x90) or Responsive High visibility, but keep it non-intrusive. High Viewability, good for brand awareness.
    Within Content (After 2nd/3rd Para) Medium Rectangle (300x250) In-article Integrates naturally into reading flow. High Engagement & Click-through Rate (CTR).
    Within Content (Floated Right) Skyscraper (300x600) or Rectangle Complements content without breaking flow. Good RPM, enhances content layout.

    Conclusion

    I’ve implemented these exact techniques on countless Blogger sites, from niche hobby blogs to large content publishers, and the results speak for themselves. Strategic, code-level ad placement consistently outperforms random widget placements. By taking control of your template and understanding the relationship between and , you’ve moved beyond a basic Blogger user to someone who truly optimizes their platform.

    Remember, the goal is sustainable revenue that doesn’t alienate readers. Start with the ad below the title, monitor your AdSense performance reports for a week, and then introduce the in-content ad. Use the data to guide you, note which ad units and placements bring the best balance of RPM and user engagement. This isn't a one-time setup; it's the beginning of a data-driven optimization process. You now have the foundational skill set to experiment confidently. Go ahead, save your theme, publish a test post, and watch as your Blogger site starts working more effectively for you.

    Frequently Asked Questions (FAQ)

    Will these ad placements work on all Blogger themes?

    Yes, the method is theme-agnostic because it targets the core Blogger data tags (`<data:post.title/>` and `<data:post.body/>`) which are present in every single Blogger template. The exact surrounding HTML might differ, but the core tags and the logic for inserting code near them remain constant.

    Is it against AdSense policy to put ads inside the post content?

    Not at all. In fact, Google encourages "in-article" or "in-feed" ad placements as they often see higher user engagement and viewability. The key is to comply with the general policies: don't use more than 3 ad units per page, ensure ads are not deceptive, and avoid placing them too close to site navigation or other interactive elements where accidental clicks are likely.

    The ad in the middle of the post only shows on some posts. Why?

    This is by design in the provided code. First, it only shows on individual post pages (`item` pages), not the homepage or archive pages. Second, the JavaScript logic is set to insert the ad only if the post has more than a certain number of paragraphs (e.g., `> 4`). If a post is too short, the ad won't inject itself, which prevents a poor user experience on brief posts.

    Can I use this method for other ad networks like Ezoic or Mediavine?

    Absolutely. The fundamental principle is the same. Instead of AdSense JavaScript, you would paste the ad code provided by Ezoic, Mediavine, or any other network into the same locations. The process of embedding code via the template HTML is universal for any external script you want to load in a specific location.

    How do I make the in-content ad responsive on mobile?

    The best approach is to use a responsive ad unit from your ad network. For the floated ad, you can wrap it in responsive CSS. A simple fix is to modify the `<div>` style to include: `style='float: right; margin: 10px; max-width: 100%;'` and then add a media query in your template's CSS (found in a `<b:skin>` section) like: `@media (max-width: 768px) { #ad-position-1 { float: none; margin: 20px auto; display: block !important; } }`.

    What should I do if my site layout breaks after saving the HTML?

    Remain calm. This is why you created a backup. Immediately go back to Theme > Edit HTML, click the three-dots menu, and select "Restore." Choose the backup you saved just before making changes. Your site will revert instantly. Then, carefully re-follow the steps, ensuring you haven't deleted any crucial closing tags (`</div>`) or misplaced the code.

    Does placing ads like this slow down my Blogger site?

    Any external script, including AdSense, adds some load time. However, because you are placing the code directly in the template (not inside a slow-loading, third-party widget), you are using the most efficient method possible. To minimize impact, ensure you are not overloading the page with too many ad units. The two placements described in this guide are optimal for performance and revenue balance.

    Sources:
    https://support.google.com/adsense/answer/7183212
    https://bloggercode-blogconnexion.blogspot.com/
    https://support.google.com/adsense/answer/1346295

    Tags: blogger adsense, blogger seo, blog monetization

    About the author

    Raqmedia
    AI, Tech Tutorials & Premium Courses: Your go-to hub for in-depth AI product reviews, quality tutorials, cutting-edge trend analysis, tech news, tools and tips Marketing and SEO expert insights.

    Post a Comment

    Thank you for taking time to comment. 😊 💙

    🔔 If you're interested in more, have questions, or any constructive criticism, let us know in the comment section below!

    ⚠ Your email address will not be published. By using this form you agree with the storage and handling of your data by this website.