How To Show Or Hide Blogger Widget On Homepage, Post Pages, Static Pages, Or On Selected Pages

Tweets by @mrqasimashraf

It is always important that you control how widget function in your blog, because their are some widget that are suitable mostly for homepage only while some makes sense post pages, archive pages, and so on. Most frequently asked question by my blog readers is that how can they hide a particular widget (especially recent post widget) from displaying in homepage in other to reduce the load time of their homepage, while some are interested in showing a widget on only homepage. So if you are also interested in controlling your widget performance, then this tutorial will trash out your worries.
We will be using different conditional tag to selectively display widget on any preferred pages.

How To Show Widget Only On Homepage

Use the following conditional tag to show widget on homepage only.

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

WIDGET CODE HERE

</b:if>

How To Hide Widget On Homepage

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

WIDGET CODE HERE

</b:if>

How To Show Widget Only On Static Pages

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

WIDGET CODE HERE

</b:if>

How To Hide Widget On Static Pages

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

WIDGET CODE HERE

</b:if>

How To Show Widget Only On Archive Pages

<b:if cond='data:blog.pageType == &quot;archive&quot;'>

WIDGET CODE HERE

</b:if> 

How To Hide Widget On Archive Pages

<b:if cond='data:blog.pageType != &quot;archive&quot;'>

WIDGET CODE HERE

</b:if> 

How To Show Widget On A Selected Post

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

WIDGET CODE HERE

</b:if>

How To Hide Widget On A Selected Post

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

WIDGET CODE HERE

</b:if>

How To Wrap Widget With The Conditional Tag

The conditional tag can be applied to any widget using the same procedure.

• Go to your blogger dashboard
• Click on Template > Edit HTML > Proceed (Mark/Tick Expand Widget Template)

Every widget has a code structure, but you can easily locate a widget using the widget title. Each widget code structure will look like the following:

<b:widget id='Widget-ID' locked='' title='Widget-Title' type=''>
<b:includable id='main'>


LARGE CODE


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

Wrapping the widget with any conditional tag, the final result will look like the following:

<b:widget id='Widget-ID' locked='' title='Widget-Title' type=''>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>

LARGE CODE

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

The conditional tag used above is just an example, you can choose any condition tag of your choice, and the same procedure applies to all.
Any queries or contribution/appreciation is highly welcome, and don't forget to share it with friends/followers.

Enjoyed This Post? Subscribe For More Update!

Follow @mrqasimashraf