Show Widgets Only in Homepage or in Post Pages

Once you activate any widget, in your blog, it will be displayed in all the pages by default, including your homepage.
But sometimes, we do want to show some widgets only on Homepage or only for the individual posts pages, or only in a specific page, the coding is quite simple, but you need to customize the widget through the "Edit HTML" link in your "Layout" section.

Follow these steps:
Create any widget, and place it where-ever you want, and save the template. Check if it is working (should be displayed in all the pages). Remember to give a TITLE to it, like Archives/BlogRoll/Maps/Clock, anything unique.


Now go to "Edit HTML" page.
Click/mark "Expand Widget Templates"
Then find for that unique Title (by searching through CTRL+F method)
It will be something like this:
<b:widget id='HTML3' locked='false' title='UNIQUE WORD OR TITLE HERE' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>

Now tweak this as follows

CASE #1
To SHOW the code/widget only in HomePage
<b:widget id='HTML3' locked='false' title='UNIQUE WORD OR TITLE HERE' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

CASE #2
To SHOW the widget in "All Posts", but NOT in HomePage
<b:widget id='HTML3' locked='false' title='UNIQUE WORD OR TITLE HERE' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

CASE #3
To SHOW the widget in any particular page
<b:widget id='HTML3' locked='false' title='UNIQUE WORD OR TITLE HERE' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == "SPECIFIC_BLOG_POST_URL"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
Add those code lines in red color, as per your requirement.

CASE #4
To HIDE a widget ONLY in a particular page/post, and to display it in all other pages of your blog, use this code (shown below is only the code in RED from the previous code):
...
...
<b:if cond='data:blog.url != "SPECIFIC_BLOG_POST_URL"'>
...
...
...
</b:if>
...
...

CASE #5
To SHOW widgets only in Archive Pages
...
...
<b:if cond='data:blog.pageType == "archive"'>
...
...
...
</b:if>
...
...

CASE #5
To SHOW widgets only in Static Pages
...
...
<b:if cond='data:blog.pageType == "static_page"'>
...
...
...
</b:if>
...
...

CASE #6
To HIDE widgets in Static Pages
...
...
<b:if cond='data:blog.pageType != "static_page"'>
...
...
...
</b:if>
...
...

ProBlogger - Inspiring Others Realize Their Dreams!

Share this

Related Products

Related Posts

Previous
Next Post »

73 comments

Write comments
Anonymous
January 21, 2009 5:46 PM delete

thank you very much

Reply
avatar
jai ho
March 01, 2009 11:28 AM delete

i tried for display widget in "All Posts", but NOT in HomePage but all the widgets are also showing at homepage. :)

Reply
avatar
Anonymous
March 03, 2009 8:52 AM delete

I implemented it to show a widget only on homepage in the crosscol section of my testblog and it works great.
Thank you very much. This is just what I'm looking for.

Reply
avatar
March 05, 2009 6:19 AM delete

:)) The second Version is not working. . guess to show on all page except homepage

Reply
avatar
March 05, 2009 8:18 AM delete

Well dude, I have myself used all these hacks, and they have worked well in my blogs, make sure all the code work is in correct place...

Reply
avatar
March 09, 2009 5:29 AM delete

Great tweaks to hang around for blogger's ..

Thanks for providing this useful tricks...

Reply
avatar
March 14, 2009 1:28 PM delete

Thanks a lot for providing this extra ordinary tweak...

Reply
avatar
March 19, 2009 8:56 PM delete

Thanks for the tips. Hi all, please remember to replace " with "&

Reply
avatar
March 20, 2009 9:22 AM delete

Hi Swanie, about which of the 3 hacks are you talking about ?

Reply
avatar
Heythem
March 25, 2009 9:16 AM delete

Tnx again Divya Sai

I have a question, Does Widget(Contain Text Only) Slows your loading time of blog?

If yes
{
What if I used only "To display widget in any specific page"

Does it slows my HOMEPAGE? or the only specific pages I choose?
}

If No
{
Can I Spam it? assuming text are easy to load

Your HTML cannot be accepted: Tag is not allowed

so I will use c language

like this

if(data:blog.url == "blog.com/title1)
{
Text:title 1
}

if(data:blog.url == "blog.com/title1)
{
Text:title 1
}

}
I hope you will answer my questions. tnx

Reply
avatar
March 25, 2009 9:31 AM delete

If you are considering only text/simple HTML widgets, then you need not have to worry about SEO/loading time as text is very light & easy to load, but if there are pictures/videos or javascript etc., in the widget, then it will of course delay the loading time.

Now if you use widgets to display only in certain pages(eg. homepage), then it will not slowdown your other pages...

Reply
avatar
Heythem
April 01, 2009 10:52 AM delete

I used it and it works very well

It is very useful like your FEATURED CONTENT

TNX

Reply
avatar
April 05, 2009 4:45 AM delete

i want to hide the social bookmarks from the homepage but i have done the coding in the html layout now what's the UNIQUE WORD OR TITLE of it..
how can i hide them without knowing its title

Reply
avatar
push
April 05, 2009 4:46 AM delete

i want to hide the social bookmarks from the homepage but i have done the coding in the html layout now what's the UNIQUE WORD OR TITLE of it..
how can i hide them without knowing its title :((

Reply
avatar
April 05, 2009 5:08 AM delete

You do not need the unique word now, simply add the code for bookmark buttons between the code required to hide them from the homepage,
Read this comment:
Read More

And for the social bookmarking buttons code, you may read this post:
Social Bookmarking Buttons

Reply
avatar
May 26, 2009 9:04 AM delete

it works as a charm !
i search &alt;b:widget id then i add the codes in red and it works. the widgets are only shown in pages i wants, but there is a very small rectangle in their place.

another 100% working hack, thanks divya :|

i give a name to every widget in order to find in in the HTML code, then i erase the names and let it blanc ;;)

Reply
avatar
July 23, 2009 2:42 AM delete

hi.thnx a lot for the info.but i want to know, what if i want the widget in certain FEWS pages.
example, i just want to be only in 10 selected pages.

Thank you

Reply
avatar
November 13, 2009 8:39 AM delete

It sure worked, but my main content doesn't resize. Please help: http://kh-spy.blogspot.com/2009/11/spy-another-test-for-article-submission.html

Reply
avatar
November 25, 2009 7:16 AM delete

thank you. i was trying to figure this out on my blog and your post pretty much solved it for me.

Reply
avatar
January 09, 2010 7:04 AM delete

how can i put a widget only in label page .??

Reply
avatar
January 09, 2010 9:07 AM delete

Instead of this "SPECIFIC_BLOG_POST_URL" use the specific url of a label.

Reply
avatar
January 11, 2010 10:34 AM delete

Before I try this on my blog, I would like to know, how can I use this widget for multiple labels. I want to show specific header for specific label. I have at least 4 to 6 labels. Can I use the above widget and how?

Reply
avatar
January 18, 2010 10:37 AM delete

Hi Kanchan, plz mail me all your 6 header images along with the lable urls (to this address bloggerstop.net@gmail.com)

Reply
avatar
January 20, 2010 1:39 AM delete

I've mailed you all my blog headers and label links. Thank you.

Reply
avatar
January 20, 2010 1:40 AM delete

Is there any way we can have 'Reply' comment option, like Wordpress - "individual comment reply option"?

Reply
avatar
January 20, 2010 7:42 AM delete

Yeah I got your mail Kanchan, I'll reply to it soon.
BTW yes you can have those reply buttons and many more additional fuctions, read this post:
http://bloggerstop.net/2009/07/add-intensedebate-disqus-and-js-kit-to.html

Reply
avatar
February 01, 2010 3:10 PM delete

I tried putting this on a certain page and it didnt work, there are more lines in my layout then yours, would that cause an issue? Can I email you mine too?? That would be awesome.

Reply
avatar
February 08, 2010 7:58 AM delete

Yes you may email me your template ans also plz mention exactly what is your requirement, like mention the widget (with title) that you want to display only in the homepage or in the posts pages.

Reply
avatar
February 16, 2010 1:26 AM delete

This is a nice feature to add, I assume the URL that's displayed when I am viewing my new page is the URL thats added in place of SPECIFIC_BLOG_POST_URL
Also I had to add "/" to properly close the code but the forum is till showing up on the main page as well as the forum page.
Any idea's?
Thanks, Brett

Reply
avatar
February 16, 2010 1:43 AM delete

Hey Brett,

No, that Slash "/" is not required.
Slash "/" is used only after .com/ or .net/
but never after .html/ or .php/

Remove that slash, and your forum will stop displaying in your homepage.

Reply
avatar
March 13, 2010 3:50 PM delete

I found this advice on many other sites but never managed to pull it off without this nice and simple guide how to do it.

Many thanks and this post made me add your site to my Bookmark list :-)

Reply
avatar
March 19, 2010 8:10 PM delete

Hi
Seeing how you make things look easy I am tempted to ask you to help me please with 3 problems that I have.
1. How can I make posts with a particular label appear in a static page.
2. How can I force blogger to show only three or four labels and not more although I want to use a lot more.
3. How can I make a post page free from side bars. I want the side bars for home page but not for post pages.

I will be looking forward to hearing from you.

Millions of thanks.

Reply
avatar
March 22, 2010 6:40 AM delete

I will wait to get you help and advice. Thanks.

Reply
avatar
March 26, 2010 1:27 PM delete

hi just spent an hour sorting all my widgets out great all ok and easy but- i have a small problem, i cant seem to be able to show the adsense and archive and also other post only on the homepage, every time i try to put in the extra codes i get a html script issue when i try and save the template
you can see what i mean
http://white-owl-conspiracy.blogspot.com/

what do you suggest?
cheers

Reply
avatar
May 09, 2010 11:25 AM delete

Thanks so much for this...I think it will had some sparkle to my new blog!! :-)

Reply
avatar
June 13, 2010 2:23 AM delete

Amazing just followed everything form the forum creation to this and it looks sick on my blog

http://buyingairyeezys.blogspot.com/p/nike-air-yeezy-forum.html


Thanks ever so much now all I need is to create the next and previous tabs that you have on this page and ill be soooooo happy.

Thanks ever so much for this

Regards

Reply
avatar
June 30, 2010 6:42 AM delete

This does seem to be working for me. I have a ton of widgets to get through and exclude from my forum page. I just did the first one and it LOOKS like I excluded it, but that the sidebar WRAPPER is still there. Is there a fix for that?

Thank you.

Reply
avatar
June 30, 2010 7:02 AM delete

One more point ... it SEEMS like the widget for the main post is quite different and I couldn't figure out how to exclude that from the forum page.

While the Adsense widgets look different (simpler) in expanded form it looks like the exclusion there is pretty straightforward.

If I can get all these widgets excluded and the wrappers too this will be great. Thank you very much.

Reply
avatar
July 08, 2010 8:00 AM delete

I just embedded a forum on my blog by following a tutorial on your website. As you described i did the same and then made the widget available only in the specific page, the forum is working perfect but below this i see my sidebars, other gadgets. etc. I don't want them as it is in your forum, how to do that?

here is the link http://enewsreport.blogspot.com/p/world-today-forum.html#/

Reply
avatar
July 08, 2010 8:16 AM delete

This was an AWESOME POST that allowed me to start a forum. (It's not open to the public yet but it looks really great IMO).

I solved the sidebar issue with help from the Blogger forum. You need some conditional code. It took me a WEEK to figure out so buddy you scored!

My only problem is I don't know how to post code in a comment. I will try:

Right under this:

]]>

Put this:

[b:if cond='data:blog.url== "YOUR_FORUM_URL_HERE"']
[style]
#main-wrap1,
#left-sidebar-wrap,
#sidebar-wrap,
.NewTopSidebar {display:none;}
#main-wrap{display:none}
[/style]
[/b:if]

Everywhere I used [ use the carrot "<" and use ">" instead of ]

Also I found that my main wrapper is call "wrap" not "wrapper" so make sure you sidebar and main wrap names are correct.


My forum is here:

http://www.nyskiblog.com/p/harvey-road-forum.html

no sidebars!

MANY thanks to BloggerStop.net!

Reply
avatar
July 08, 2010 10:05 AM delete

Hey Harvey,

Glad to know that your forum is now looking exactly as you want. Due to my busy schedule couldn't reply to comments on my blog - so sorry for that.
Anyways, I will try to answer the pending queries of this post now...

Reply
avatar
July 08, 2010 10:35 AM delete

@Sanskar,
In your template, fiond this code:

</head>

And IMMEDIATELY above/before it, paste this code:

<b:if cond='data:blog.url == &quot;http://enewsreport.blogspot.com/p/world-today-forum.html&quot;'>
<style type='text/css'>
#outer-wrapper {
display:none !important;
}
</style>
</b:if>

Reply
avatar
July 08, 2010 1:37 PM delete

Oh yeah!! Thanks it worked!! Do you have a tutorial to add facebook connect also? I tried their developers video, and janrain application both are not working for me, I dont want disqus coz their comments will not be crawled by google and js kit doesn't look free

Reply
avatar
July 08, 2010 2:11 PM delete

I hope this tutorial will help you:
Add Facebook Buttons and Widgets To Your Blog

And thanks for informing about js-kit (echo), as I didn't know that it went completely premium now.
In that case, the options left with you are disqus and IntenseDebate, but not sure if they have done something for SEO recently or not.

Reply
avatar
July 29, 2010 11:10 PM delete

hi...I put read more widget in my blog..unfortunately the read more also function at pages. I don't want read more show at pages...help me plzz

Reply
avatar
July 30, 2010 12:25 AM delete

Which method do you use to truncate your posts?
and how many posts do you have on your blog, where you ar eusing this read more hack?

Reply
avatar
July 30, 2010 12:21 PM delete

actually I'm still not using the tutorial above bcoz i'm not understand...I have 23 post in my blog..and 1 have 6 pages that I put on menu bar...however the pages also have readmore button and when click, it does not show details post.

Reply
avatar
July 30, 2010 12:31 PM delete

Okay 23 posts in not a big number. You can easily remove that read more button from your static pages, just tell me which method/code do you use to truncate the posts (is it <!-- more --> or this one <span class="fullpost"> or is it an automatic truncating script).

Reply
avatar
August 07, 2010 2:49 AM delete

hi..below is my read more scropt

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

<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumbundefined&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> Read full story</a></span>

</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>


how to change the script...I only want the read more only show in homepage only and not include static page

Reply
avatar
August 28, 2010 3:10 PM delete This comment has been removed by the author.
avatar
August 28, 2010 3:12 PM delete

My template was a different one .how can i add this widget only for my home page

Reply
avatar
August 28, 2010 3:36 PM delete

Which widget? Be it any template, use the code from CASE #1.

Reply
avatar
September 16, 2010 10:42 PM delete

FINALLY!!!!! I have been searching and searching for a way to only have by widgets on my home page. This is the ONLY post I have found that tells you to go in AND NAME your widget w/a unique title so you can find exactly where to place your html fix. Perfect solution, I am so happy to finally have this worked out.

Reply
avatar
December 21, 2010 3:03 AM delete

AH!
Hello admin,
Is this trick for Blogger or Wordpress?

I dont think we have these codes in wordpress.
CAn you please help me to show some widjets only in Homepage of wordpress?

Reply
avatar
January 17, 2011 12:29 PM delete

THANK YOU! I've been trying to figure out all day how to get my widget to only appear on my homepage. Yours was the first one that worked! thank you thank you :)

Reply
avatar
March 09, 2011 3:11 AM delete

i cant make it work for adsense!

Reply
avatar
July 14, 2011 1:17 PM delete

Thanks a lot for this post. I loved it :)

Reply
avatar
September 29, 2011 11:48 PM delete This comment has been removed by the author.
avatar
November 01, 2011 4:36 AM delete

Awesome, man!

Thank you so much for this!

Reply
avatar
February 06, 2012 1:13 AM delete

How to control slider movement which is showing favourite posts. Say we want to block on X page and slider code is embedded in template. It will be great if you can amplify. Your above post works very well for widgets. Rgds

Reply
avatar
October 26, 2012 12:02 AM delete

On the Case 3


what if i have more than 1 URL?

Reply
avatar
October 26, 2012 8:37 PM delete

Clicking on the unsubscribe link leads me here.

Reply
avatar

Comments are moderated on this blog

Allowed HTML tags: <b>, <i> and <a>

Comment Like This! and Optimize your blog EmoticonEmoticon