show the widget only on the home page blogger

sometimes we need to show the widget only on the home page. we can show some notes for the viewers who visit our homepage. you can also hide some elements from the home page. if you want to know how then read this post.

in this post, I am gonna tell you how to show the widget only on the home page.  this is not difficult anyone can easily do it. you just need to edit your template. so let's start.

show the widget only on the home page.

1. Log in to your Google account and go to the blogger.
2. select your blog where you are going to show the widget only on the home page. 
3. from the dashboard click on the Template link. Now click on the Edit HTML button. 
   
4. you will see your template code click anywhere on the code. press ctrl+F and search the widget name that you want to show only on the homepage. 
   
5. after finding the widget just wrap widget content with the following b: if condition code.

<b:if cond='data:blog.url == data:blog.homepageUrl'>

example your widget code is looking like the following code.

<b:widget id='HTML1' locked='false' title='Recent Posts' 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 != ""'>
<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>

if you want to show above code only on the home page. then just add the following condition code before and after the widget contents. in the following widget, the condition code is marked with red color.

<b:widget id='HTML1' locked='false' title='Popular Posts' 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 != ""'>
<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>  

that's it now click on the save button. visit your blog your widget is displaying on the home page only.

How to hide widget from the home page only?

with the same method, you can hide the widget from the home page only. the method is same but to hide the gadget from the home page only we will use the following condition.

go to the template. click on HTML search your widget code and add following condition. as we add in the above widget.

<b:if cond='data:blog.url != data:blog.homepageUrl'>

by adding this condition your widget will be displayed on all pages. but It's hidden from the home page.