When you add a widget (or a gadget as Blogger would call it) 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 or
pages the widget appears? The answer is yes you can -using conditional tags.
You might notice my Live visitor widget only appears on Home page. That’s
because I applied this very trick to it. Okay let’s proceed:
1.
Find your widget ID
To address a widget id in HTML or CSS, you need to know the widget's ID. Here is
How to find Blogger Widget ID and Section ID
2. Locate the widget code
in HTML
* Login to
Blogger
* Go to Dashboard
>Design>Edit HTML
(Note
:
before you make any changes please make sure that you have Backup your HTML)
* Check the Expand Widget
Templates, Check box on top right of the HTML Window.
* Find your widget id in
the HTML using Ctrl+F and entering the widget ID in the search box.
Your widget code might
look like this. It may be a little different, but it's okay.
3. Applying the conditional tags
Insert the opening tag <b:if cond='Condition'> immediately after
<b:includable
id='main'> and the closing tag </b:if> immediately before
</b:includable> as
shown below. The code checks whether the condition is true, and executes the
content if it is.
To show a widget on index pages (i.e. homepage,
archive and label pages), replace 'CONDITION' with
'data:blog.pageType == "index"'
So the proper code will look
<b:if cond='data:blog.pageType == "index"'>
To show widget only on post pages replace
'CONDITION' with
<b:if cond='data:blog.pageType == "item"'> the attribute refers to post
pages.
To show widget only on Static pages replace
'CONDITION' with
<b:if cond='data:blog.pageType == "static_page"'>
To show widget only on archive pages replace
'CONDITION' with
<b:if cond='data:blog.pageType == "archive"'>
To show widget only on homepage replace
'CONDITION' with
<b:if cond='data:blog.url == data:blog.homepageUrl'>
To show widget on a specific page/url replace
'CONDITION' with
<b:if cond='data:blog.url == "http://emdadblog.blogspot.com"'> Provide
your own url in "http://emdadblog.blogspot.com"
To show widget on pages other then the specified
page replace
==
with !=
for
example to show widget on pages other then hompage,following
code should like this
<b:if cond='data:blog.url != data:blog.homepageUrl'>
4. Save and
enjoy.
Hi,
ReplyDeletecan you help me? How show widget only on home and archive but not on post pages?
Thanks.
ah, ok, now seen: "To show widget on pages other then the specified page".... Thanks anyway!
ReplyDeleteYour code for displaying widgets on certain conditions rocks. I just implemented on http://www.kitchengarden101.com/ and it works great. It doe not display adsense on the main page.
ReplyDeleteHurm....can't work it out properly...
ReplyDeleteget this message instead even i copy paste exactly like you stated here...
"Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The element type "b:section" must be terminated by the matching end-tag ""."
Can help me with this area?
Thanks..
@Shah
ReplyDeleteHello Sir,
Sorry for late response.
Actually the problem appear when the closing tag does not properly close. Please make sure that you have use the closing tag properly.
If you can't solve the problem don't hesitate to contact with me at emdadekh@gmail.com
Thanks.
Tutorials and tips are useful because I just knew I could put the widget on a certain page ..
ReplyDeletehi. do you knwo i i could display a widget on a couple of pages only? I know how to make it display on home/archive/posts pages...but I want to know how to make it disaplay on page x, y, and z. (without having to create 3 widgets)
ReplyDeleteGreat tip, thanks once again.
ReplyDelete