31 July 2011
Show Blogger Widgets - Gadgets in Specific Posts or Pages
When you add a widget or a gadget to your blog, by default the widget would appear on all pages Homepage, index, archive, post and static pages. But what if you want a certain widget to appear only on a certain page or pages, can it be done? In other words can you select on which page/pages the widget would or would not appear? The answer is yes you can by Using Blogger Conditional Tags.
Go to Blogger's > Dashboard > Design > Page Elements tab 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 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:
Show Blogger Widget in Post Pages Only:
If you want to hide any widget or gadget from showing it on homepage or other page and to 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 == "item"'>
<!-- 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>
Show Blogger Widget in Homepage and Other Pages (except post pages)
<b:includable id='main'>
<b:if cond='data:blog.pageType == "index"'>
<!-- 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>
Show Widget on Particular Post
<b:includable id='main'>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 pages you want.
<b:if cond='data:blog.url == "URL of the page"'>
<!-- 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>
About Author
Ahmed Shehzad Hi, I am the Founder and Editor of Blogger4ever, I loves writing about Blogger Tricks and Tips, Blogger Tutorials, Hacks and Widgets and everything about Blogger.... Follow me on Google+
Subscribe to:
Post Comments (Atom)
0 Responses to “Show Blogger Widgets - Gadgets in Specific Posts or Pages”
Post a Comment