How to Show or Hide Widgets on Specific Blogger Pages

Advertisements
Sometimes people desire to show some widgets on few parts of their website, so it unnecessarily does not decrease the speed of other pages. Blogger BlogSpot users always complain that they cannot display gadgets on the specific part of their website i.e. Homepages, Post Pages and Static pages, but now it is extremely straightforward to restrict some widgets on certain pages. There are numberless reasons why a person wants to show gadget on certain pages because it could be anything. Consider a person created a featured content slider widget but he wants to display it only on the homepage. Therefore, those who are anxiously looking for a method of restricting widgets on specific pages then, today in this article, we will learn How to Show and Hide Blogger Widgets on Specific Pages?

How To Display a Certain Gadget on Specific Pages?


1. How to Display a Widget only on Homepage?
Just paste the HTML/JavaScript or CSS Coding between these lines. It will show the gadget only on the homepage of your website. It would hide the gadget from Post pages and static pages. 

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

WIDGET CODE GOES HERE

</b:if>



2. How to Hide a Widget on Homepage?
The following coding can be used if someone wants to restrict/hide a widget from the homepage of his site. Just add your HTML gadget coding between two lines. It would show the gadget on each and every page except homepage. 

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

WIDGET CODE GOES HERE

</b:if>



3. How To Display a Widget only on Posts?
If anyone wants to show a gadget only on post pages, then use the following coding. By using the following coding the gadget would only appear on your Posts.

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

WIDGET CODE GOES HERE

</b:if>



4. How To Display a Widget on Static pages?
If anyone wants to hide a gadget from his Static pages then, he can use the following coding. It would appear only on Static Pages.

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

WIDGET CODE GOES HERE

</b:if>

5. How to display a Widget on Archive pages?
If anyone desires to show a gadget on Archive pages of your website then, use the following coding. It would hide it from each and every page, expect the archive pages. 

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

WIDGET CODE GOES HERE

</b:if>

6. How to display a Widget on Homepage and Post Pages?
Sometime, we desire to show certain HTML Coding on the homepage and posts. In this case, use the following coding and it would hide the gadget from Static pages. However, it would keep on appearing on Home and posts of your site. 

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

WIDGET CODE GOES HERE

</b:if>

7. How to Display a Widget on Homepage and Static Page? 
Apply the same instructions over here. It should hide the gadget from posts of your site. However, it would continue to display them on home and static pages. 


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

WIDGET CODE GOES HERE

</b:if>

8. How to Display a Widget on Posts and Static Pages? 
By using this coding the gadget would appear on Posts and Static pages. However, it would remain hidden from homepages. 


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

WIDGET CODE GOES HERE

</b:if>


How To Control Blogger's Official Widgets? 

We can apply the same procedure on Blogger's Official widgets. In fact,  these condition is applicable through out the blogger platform. Which means, we can use these conditions during our Posts, Layout and etc. For Controlling widgets do as followers.

  • Go to Blogger >> Template >> Edit HTML  >> Proceed. 
  • Check the Expand Widgets Templates Box
  • Search for the title of the widget you want to control
  • The code which you would find might look something similar to this one,

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

Widget CODE (Large Chunk) 

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

On finding the coding as mentioned above, you have to Add <b:if> conditions just between these two tags <b:includable id='main'></b:includable> . After adding the <b:if> conditions the coding would look something similar to this one. 

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

<b:if cond='data:blog.url == data:blog.homepageUrl'>
LARGE CHUNK OF WIDGET CODE
</b:if>

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


All Done: That's it, Save the template by pressing "Save Template Button". We hope this technique would help everyone to improve their site speed by restricting unused widget  on certain pages. Feel free to leave your comments and suggestion, Till then Peace, Blessings and happy blogging.
Advertisements

The Editorial Team of MyBloggerLab consists of a group of Professional Blogger geeks Led by Syed Faizan Ali (Founder of MyBloggerLab).

Comment With:
OR
Choose Wisely!

18 comments

December 28, 2012 at 11:23 AM

Really Great Post! I think you are doing postmortem on blogger :D

IM
December 28, 2012 at 7:25 PM

always post cool trick... Thanks

December 29, 2012 at 3:25 AM

Nice.. But I have moved to Wp! :(

Editorial Team MOD
December 29, 2012 at 7:58 AM

OH! Happy for You :) but Said for Me :( Because we might loose a Awesome Follower. Hope you would love you WP Journey. Peace

December 30, 2012 at 11:06 AM

@Faizan,
is this post not completely copied from MBT, check this URL:
http://www.mybloggertricks.com/2011/01/how-to-show-and-hide-widgets-in-blogger.html

and this was actually published 7 months back on MBT, As I observe this blog for last few months and I understand that 50%+ content of this MBL is copied from MBT without giving any credits to MBT...


Is this justice??

Editorial Team MOD
December 30, 2012 at 11:13 AM

I Guess You Missed it!

MBT Hasn't Shared the Entire Tricks. Check Out the Point Number 6 and 7 they are not shared there nor on any other site.

2ndly The trick is not directly From MBT they are shared by many other bloggers and MBT has shared it with there followers. I Don't know what you mean to say from copied conten.

AWW, we copy content from MBT :/ Really? Can you Please Give me the URL of the Articles which we have copied From MBT, It would be really thankful to you. Have a nice day

December 30, 2012 at 10:47 PM

@Faizan
Don't worry, you will get the answer about MBT soon. You may or may not delete this comment but now I am involved in this matter and I assure you not even a single word will go away from my eyes.

Editorial Team MOD
December 31, 2012 at 12:30 AM

We Never Delete Comments Whether It is Targeting the Blogger or the Author. We remove comments only if its not according to our Comment Policy.
http://www.mybloggerlab.com/p/comment-policy.html

Yes, Please It would be your Biggest Favor for the MBL Team. Have a Nice Day!

December 31, 2012 at 1:06 AM

Only time will tell if it was a Favor done or not..

Editorial Team MOD
December 31, 2012 at 1:12 AM

I Hope you Won't Take Too Long

January 8, 2013 at 11:07 AM

When I try and hide an html box, the code will remove all the text but part of the actual box remains? Any idea what I'm doing wrong. The page is www.massfarrier.com

Any help would be great.

Editorial Team MOD
January 8, 2013 at 2:33 PM

Thats Because you are not Hiding the Box Completely.You have to find the ID of the BOX and then, have to apply the B:if conditions to hide it.

Hope that helps. Peace

January 9, 2013 at 4:30 AM

that makes perfect sense, thank you so much for the reply

August 29, 2013 at 10:13 AM

Anyway to hide an html widget from a specific url (Post)?? Because some pages of my site doesn't match with advertiser terms & conditions. Please reply..It's very urgent.

Editorial Team MOD
August 29, 2013 at 4:27 PM

Please read what we have mentioned in the tutorial. Entitled with "How To Control Blogger's Official Widgets? "

January 19, 2014 at 8:58 PM

This is a nice post. i have a problem in my blog i am using Back to Top Button in my Blog but in my Home Page there are one blank widgets... i want to hide that. so how can i hide that widgets.. please reply

June 2, 2016 at 7:48 AM

Hi.. it really helped me ! I have a question that I use to write a blog in University times but now i want to change that blog to other niche.
Can you please help me in following issues i am facing.
1. I want to move all posts to new self-hosted blog without compromising present's SEO.
I thought of these things.
One remove the post and redirect to homepage.
Two edit every post and refer further readings to new one.
Three if i could redirect every blogger post (450+) to new post at other wordpress website.
One more thing.
How can i hide archives or last years. I don't want to show those archives now. I just want to show archives of 2016 but not of 2010-2013

Editorial Team MOD
June 7, 2016 at 10:37 AM

Hi,

You can hire us and we can do it for you.

Please contact me at faizan@mybloggerlab.com

Cheers

Post a Comment

We’re eager to see your comment. However, Please Keep in mind that all comments are moderated manually by our human reviewers according to our comment policy, and all the links are nofollow. Using Keywords in the name field area is forbidden. Let’s enjoy a personal and evocative conversation.

Helping You to do Cool Things With Blogger Since 2012™.

© Copyright 2012 - 2018. MBL Networks, All Rights are Strictly Reserved.