say hi and hello..

06 February 2015

How to Show and Hide Widgets in Blogger

Blogger display by default one widget on all pages and many peoples are want to display some widgets only on specific pages and they don’t want to show these widget on all pages, for example if you add slider on your homepage and you want to display it only on homepage then you can easily done it by following this method.

Everyone have different reasons to display and hide their widgets or any text from their desire pages and one of the biggest reasons is many peoples want to display adsense or any other advertisement on their homepage and when anyone click on their post then this widget will be automatically hide and one another widget display on posts, I think this is one amazing idea and also help you to increase your earning.

See Also :- How to Add Gadget Above the Blog Header

How to Show and Hide Blogger Widgets?

Below we will divide this topic in different parts, just select your desire part and put your widget coding in highlighted place and hide or show gadget from your desire page.

1. How to Show Widget only on Homage?
This method will help you to display a one widget only on homepage. Just Copy below coding and paste your desire HTML/JavaScript or CSS coding between two lines.
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Your Widget Code Goes Here!
</b:if>

2. How to Show Widget only on Blog Posts?
You can show your desire gadget only on posts and it will not appear on your homepage or any other page. Just Paste your widget coding between two lines.
<b:if cond='data:blog.pageType == "item"'>
Your Widget Code Goes Here!
</b:if>

3. How to Hide Widget only from Homepage?
You can also hide your desire gadget from homepage and it will be display on all pages of your blog without homepage, just add your desire HTML/JavaScript or CSS codes between two lines.
<b:if cond='data:blog.pageType == "item"'>
Your Widget Code Goes Here! 
</b:if>

4. How to Show Widget only on Static Pages?
This method will help you to hide any widget only from static pages and you can display your desire widget only on homepage and posts, just add your widget coding between two lines.
<b:if cond='data:blog.pageType == "static_page"'>
Your Widget Code Goes Here!
</b:if>

5. How to Show Widget only on Archive Pages?
You can display any widget only on archive pages and it can’t display at any page without archive pages. Simply enter your gadget coding between two lines.
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
Your Widget Code Goes Here!
</b:if>

See Also :- How to add page number navigation in blogger


6. How to Show Widget only on Homepage and Post Pages?
If you want to display gadget only on homepage and post pages so simply enter your widget coding between two lines and your widget will be display only on homepage and post pages.
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
Your Widget Code Goes Here! 
</b:if>

7. How to Show Widget only on Posts and Static Pages?
If you want to display widget only on posts and static pages then simply enter your gadget coding between two lines and your widget will be hide expect post and static pages.
<b:if cond='data:blog.pageType != &quot;index&quot;'>
Your Widget Code Goes Here!
</b:if>


8. How to Show Widget only on Homepage and Static Pages?
You can display your gadget only on homepage and static pages and it can’t display on your posts or any other page, just enter your widget coding between two lines.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
Your Widget Code Goes Here!
</b:if>

How to Show or Hide Blogger Official Widgets?
You can also show or hide blogger official widgets by using above codes but here we will need to edit some codes in our blogger template and then we will hide or show bloggers official widgets, just follow below steps.

  • Go to your Blogger Dashboard>> Template >> Edit HTML.
  • Find the title of widget that you want to hide.
  • Now when you find any widget then it might look like below one. 

<b:widget id='HTML' locked='false' title='Title-Display-Here' type='Profile'><b:includable id='main'> Widget Code Display Here! (Its Look Like to Large) </b:includable> </b:widget>
When you find your desire coding then simple Apply any Code from above 8 parts and you just need to enter <b:if> between <b:includable id='main'></b:includable> tag and after it your widget will Look like same below coding.

See Also :- How to Add Stylish Set of Share Buttons to Blogs
<b:widget id='HTML' locked='false' title='Title-Display-Here' type='Profile'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Widget Code Display Here! (Its Look Like to Large)
</b:if>
</b:includable>
</b:widget>

After it simply Click on “Save Template” and you are done everything successfully.

Share on Facebook
Share on Twitter
Share on Google+
Tags :

Related : How to Show and Hide Widgets in Blogger