If you are looking to increase your ad revenue, placing ads in the middle of your blog posts is a great idea. It catches your readers attention while they are focused on your content. Here is a quick guide to help you add middle article ads on Blogger.
Table of Contents
Adding these ads can really help boost your earnings. By placing ads where your readers are most engaged, they are more likely to notice and click. This can lead to higher revenue all while keeping your blog easy to navigate and user friendly.
Guide To Add Code
-
step 1:
Go to the Theme section. In the left menu, click Theme then choose Customize or Edit HTML.
-
step 2:
Next, locate the Post Section in the HTML editor, you can press Ctrl + F (Windows) or Cmd + F (Mac) to search for: <data:post.body/>. If you are on mobile, just scroll down and look for the blog1 tag section in your theme.
-
step 3:
In blog1 tag you can find closing </b:section> tag, before this tag place the given code below and make save.
Code For Middle Post Ad
<b:widget cond='data:view.isPost and !data:view.isPreview' id='HTML01' locked='true' title='Middle Post Ad 01' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<div class='adsHere ads-here'></div>]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='widget-content'>
<!--[ Middle article Ad ]-->
<data:content/>
<script>/*<![CDATA[*/ function insertAfter(tbh,tgt) {var prt = tgt.parentNode; if (prt.lastChild == tgt) {prt.appendChild(tbh);} else {prt.insertBefore(tbh,tgt.nextSibling);}} var tgt = document.getElementById("postBody"); var midAd01 = document.getElementById("HTML01"); var showAd01 = tgt.getElementsByTagName("p"); if (showAd01.length > 0) {insertAfter(midAd01,showAd01[2]);}; /*]]>*/</script>
</div>
</b:includable>
</b:widget>
Widget ID (HTML01)
HTML01 is the widget ID used for the ad block in your Blogger template. This ID tells Blogger which HTML widget should be inserted inside the post. Every Blogger template automatically gives ID to widgets such as HTML1, HTML2, HTML3 and so on. If your template already has a different ID you must replace HTML01 with that correct ID.
For Example : var midAd01 = document.getElementById("HTML1") This means the script will load the ad from the HTML1 widget instead of HTML01.
Paragraph Position
showAd01[2] controls where the ad will appear inside the blog post. The script counts the paragraphs inside the post body. The number inside the brackets decides after which paragraph the ad will be inserted.
| Value | Ad Position |
|---|---|
| showAd01[0] | After the 1st paragraph |
| showAd01[1] | After the 2nd paragraph |
| showAd01[2] | After the 3rd paragraph |
| showAd01[3] | After the 4th paragraph |
Post Body ID
The postBody ID tells the script where the blog post content is located in the Blogger template. This helps the script identify the exact area of the page where the blog article text appears so it can insert the advertisement in the correct position inside the post.
Some Blogger templates use different ID for the post content container, so you should check your template before using the script. If the ID is different the script may not detect the post content correctly.
Common post content IDs in Blogger templates:
- postBody
- post-body
- entry-content
- article-body
For Example: If your template uses post-body instead of postBody, you must change this line: var tgt = document.getElementById("post-body"); Otherwise the script will not find the post content and the ad will not appear.
Complete Working Idea
Suppose your template has the following settings:
- Widget ID → HTML1
- Post content ID → post-body
- Ad position → After the 2nd paragraph
Then your script part should look like this:
var tgt = document.getElementById("post-body");
var midAd01 = document.getElementById("HTML1");
var showAd01 = tgt.getElementsByTagName("p");
if (showAd01.length > 0) {
insertAfter(midAd01, showAd01[1]);
}
This will show the ad after the second paragraph of the blog post.
Usage Of Add Middle article Ads
Place ads carefully adding them in the middle of your articles can boost clicks(CTR) but do not use too many.
My Thought
Adding mid article ads in Blogger is a simple way to make ads more visible and increase your earnings.