How To Display/Hide Blogger Widgets On Specific Pages?

I was wondering that many people thinking about "How to show and hide widgets in Blogger" like if you want to show Popular Posts Widget only on homepage so you can use this method. This tutorial is extremely easy and already there are many tutorials about it over the web. The method is only compatible with Blogger.Its really important to control widget Display in Blogger to make your blog look maintained. Because some widgets look better only on homepages and some at Contact pages and Support pages. As  HTML/JavaScript  is mostly used so it will be the most easiest to control, but Bloggers official widgets like Popular Posts, Followers, Profile will be a little harder to control. Don't be afraid all you need will be, just enclose the widget code in two line code.


This post will deal with:

• How to Show Widgets Only On Homepages? and How to Hide Widgets On Homepages?
• How To Show Widgets Only On Static Pages? and How To Hide Widgets On Static Pages?
• How To Show a Widget On a Selected Post Only? and How To Hide a Widget On a Selected Post?
• How To Control Blogger’s Official Widgets?

How to Show Widgets Only On Homepages?

Just wrap the code inside HTML/JavaScript widget between these lines,

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

PLACE WIDGET CODE HERE

</b:if>

where  PLACE WIDGET CODE HERE  is the code of the widget you want to show or hide.

How to Hide Widgets On Homepages?

The Procedure will be same here,

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

PLACE WIDGET CODE HERE

</b:if>

How To Show Widgets Only On Static Pages?

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

PLACE WIDGET CODE HERE

</b:if>

How To Hide Widgets On Static Pages?

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

PLACE WIDGET CODE HERE

</b:if>

How To Show a Widget On a Selected Post Only?

<b:if cond='data:blog.url == "URL OF Selected Post"'>

PLACE WIDGET CODE HERE

</b:if>

How To Hide a Widget On a Selected Post?

<b:if cond='data:blog.url != "URL OF Selected Post"'>

PLACE WIDGET CODE HERE

</b:if>

 The upper portion of this post dealt with  HTML/JavaScript widget (Custom Widgets), now this post will tell you about how to do this with Blogger's official widgets e.g Popular Posts, Labels etc!

How To Show/Hide Blogger’s Official Widgets?

For Blogger official widgets same method will be applied. For controlling that widgets do this,

1. Go To Blogger > Design > Edit HTML
2. Backup your template
3. Check the Expand Widgets Templates Box
4. Search for the widget title you want to show/hide
5. The code will look like the one below,

<b:widget id='HTML' locked='false' title='WIDGET-TITLE-HERE' type='Profile'>

<b:includable id='main'>

LARGE CODE NUGGET

</b:includable>

</b:widget>

When you'll find WIDGET-TITLE-HERE you will find two similar codes like shown in bolded blue You just need to add the Controlling codes in the following manner. e.g you wanna show a widget at Homepage only then you'll do this,

<b:widget id='HTML' locked='false' title='WIDGET-TITLE-HERE' type='Labels'>
<b:includable id='main'>

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

LARGE CODE NUGGET

</b:if>

</b:includable>
</b:widget>

That was our little and easiest written post! Wasn't it? Ohkay!
So Comment Share Like 

Thanks For Making This Possible! Kindly Bookmark and Share it.