Display Blogger Widget Only On Home Page

Display Blogger Widgets On Home Page Only

Normally , widgets in Blogger blogs are displayed on all the pages. For example, look at the google translate widget on my right side bar. That widget is displayed on each and every page of my blog. But what if you want to display the Blogger widget only on the home page? Well that is possible. You have to edit your Blogger template with the following code.

Go into your dashboard and download your template just in case you make mistakes so you can backup your blogger blog. Then expand the html and make the appropriate changes to your html.

Here for example is HTML2 the widget id for "Get posts by Email". There may be different ids for different widgets as this is only an example of what could be there. The code you will be adding to fix your widget only to the home page will look like <b:if cond='data:blog.url == data:blog.homepageUrl'>

<b:widget id='HTML2' locked='false' title='Get Posts By Email' 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:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

You want to add the code that is highlighted in blue.
To recap:

1. Open your Blogger templates Layout and then Edit HTML, Click on expand widget templates .
   
2. With Ctrl+F search for each widget with its ids or given label/name.
3. Now paste the code in blue as specified above and save your template. The edited Blogger widget will now only appear on the homepage .

How to display the widget on every page except home page?

You can display a Blogger widget on all of your pages except the home page, by altering the above code in blue with this new code.

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

How to display the widget on a specific post page?

You can also display a Blogger widget only on a specific post page only, by changing the first code with the following code .

<b:if cond='data:blog.url == "blog post URL"'>


So there you have it! You now have the ability to control how widgets are shown on your Blogger blog.