How To Show/Hide Widgets On Specific Pages In Blogger

0
How To Show or Hide Widgets On Specific Pages In Blogger - When you add a widget or a gadget to your blog, by default the widget would appear on all pages Homepage, post, index, archive and static pages etc.. But what if you want a certain widget/gadget to appear only on a certain page or pages, how can it be done? In other words can you select on which page the widget/gadget would or would not appear? The answer is yes you can by How To Use Blogger Conditional Tags.

How To Show or Hide Widgets On Specific Pages In Blogger

Add Widget On Blogger Blospot

Go to Blogger's > Dashboard > Design > Page Elements and add a "HTML/Javascript" gadget. I prefer it because it will be easy for everyone to understand. Give it a unique title so that it does not match with any of the titles of other widgets/gadgets added.

Now go to Design > Edit Html tab and check "Expand Widget Templates". Now press "Ctrl+F" on your keyboard to open the browser's search bar and search for the "unique title" that you have given to your gadget. Let's say I have given the title for my widget as "blogger4ever". After searching you will find the below snippets:
<b:widget id='HTML1' locked='false' title='blogger4ever' type='HTML'>
<b:includable id='main'>
<!-- 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:includable>

It's the widget - gadget that you have added from Page Elements tab. All is left is to add conditional tags just below <b:includable id='main'> and above </b:includable> to hide the widget from specific pages or posts in Blogger. Let see some examples:

How To Display Blogger Widget in Post Pages Only:

If you want to hide any widget or gadget from showing on homepage or other page and show it on post pages then you have to add the Conditional Tags as shown below:
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- 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>

How To Show Blogger Widget On Homepage and Other Pages (except post pages)

<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<!-- 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>

How To Show Widget on Particular Post In Blogger Blogspot

<b:includable id='main'>
<b:if cond='data:blog.url == &quot;URL of the page&quot;'>
<!-- 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>
Above are some examples for some of the pages. If you have followed how to use conditional tags in Blogger, then you can hide particular widgets and gadgets from appearing on particular page or pages you want.

Conclusion:
I hope after reading this article you are able to How To Show or Hide Widgets Gadgets On Specific Pages In Blogger on your selected pages in blogger blogspot. Getting any issue please comment below.

You might also like: How To Add Inline Related Posts Middle Of The Content In Blogger
Tags

Post a Comment

0 Comments
Post a Comment (0)
To Top