Show Adsense Ads or Widgets in Homepage Only

This post is in response to the request of commenters who read the tutorial of showing Adsense ads below post title in Blogger; and wanted to show ads in the homepage only.
This tutorial is not only useful for those bloggers who are participating in the Adsense program and wanted to customize how the ads are being displayed to get a higher CTR, but also applicable to any widgets installed in Blogger blog.

The easiest way to display Adsense ads in the homepage only using Blogger is through the use of widgets. You can also insert the parsed code instead, but it’s more complicated. To do that, simply follow these steps:

1. Login to you Blogger dashboard, and click on Layout link on the blog you want to modify; and then select the Page Elements tab. (Make sure to backup your template before doing any changes)
2. Depending where you want the Adsense ads to appear on your blog, just add a Gadget and select HTML/JavaScript from the list of basic gadgets.
3. Name the new widget as “Advertisements” or whatever you like, then insert the Adsense codes in the content area in HTML mode. Save the widget.
4. Go to the Edit HTML tab and tick on the Expand Widget Templates box.
5. Look for the name of the widget (“Advertisement” for this example). You can do that by using the Ctrl+F keyboard shortcuts.
6. The widget you added will appear in the HTML template that looks like this:

<b:widget id=’HTML1‘ locked=’false’ title=’Advertisement‘ type=’HTML’>
<b:includable id=’main’>
<!– only display title if it’s non-empty –>
<b:if cond=’data:title != &quot;&quot;’>
<h2 class=’title’><data:title/></h2>
</b:if>
<div class=’widget-content’>
<data:content/>
</div>
<b:include name=’quickedit’/>
</b:includable>
</b:widget>

The unique identifiers of the widget containing the Adsense codes is the Title and the Widget ID, like the one high-lighted above.

Now, just add two lines of additional codes that will display Adsense ads only in the homepage. Take note of the codes highlighted in red below.

<b:widget id=’HTML1‘ locked=’false’ title=’Advertisement‘ type=’HTML’>
<b:includable id=’main’>
<b:if cond=’data:blog.url == data:blog.homepageUrl’>
<!– only display title if it’s non-empty –>
<b:if cond=’data:title != &quot;&quot;’>
<h2 class=’title’><data:title/></h2>
</b:if>
<div class=’widget-content’>
<data:content/>
</div>

<b:include name=’quickedit’/>
</b:if>
</b:includable>
</b:widget>

After adding the two lines of codes highlighted in red above, the Adsense ads will be displayed only in the homepage. Remember that we are doing that using a widget, so the same approach can be used when dealing with the same trick to be applied on all widgets of Blogger blog. If you have any question, just leave a comment below.

If you are new here, you can subscribe either by E-mail or by RSS Feeds. Follow me also on Twitter.

Bert Padilla

Founding-Editor of Cebu Tech Blogger where he shares insights in eCommerce, Digital Marketing, Ad Ops, Tech, Startups, Technopreneurship, Life Goals and Hacks. He's the brainchild and ninja of a Cebu-based digital agency, TekWorx.Digital, with ventures TekWorx, (eCommerce and Digital Marketing), AdWorx (Outsourced Ad Ops for Publishers) and BlogWorx (full-fledged Blog Development service). Read his Full Curriculum Vitae. For training and consultancy, services, speaking engagements, blog partnerships or media invites, click here. Alternatively, get in touch with him on Messenger.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Close Menu