In This article I am going to tell you about, How to show and hide widget in selected pages.
Primarily you have to knowledge ofHow to add widget in blog and How to find location of widget in template HTML Editor.
This article is like one simple experiment. You would done this easily.
Let us start.
I am going to experiment on Label widget. You can experiment on different widgets. For example I am use Label widget here.
You have to go to layout section for find out the location of label widget.
Must read How to find the location of widget.
The main experiment is started.
Find label widget in HTML Edit of template :
The label widget look like in html below. We have to do some small modification in this code for hide and display widget. The modification is add simple two line of code in this widget.
The label widget look like in html below. We have to do some small modification in this code for hide and display widget. The modification is add simple two line of code in this widget.
<b:widget id='Label1' locked='false' title='Labels'
type='Label'>
<b:includable id='main'>
<b:if
cond='data:title != ""'>
<h2><data:title/></h2>
</b:if>
<div
expr:class='"widget-content " + data:display +
"-label-widget-content"'>
<b:if
cond='data:display == "list"'>
<ul>
<b:loop
values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url ==
data:label.url'>
<span
expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a
expr:dir='data:blog.languageDirection'
expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if
cond='data:showFreqNumbers'>
<span
dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop
values='data:labels' var='label'>
<span
expr:class='"label-size label-size-" +
data:label.cssSize'>
<b:if
cond='data:blog.url == data:label.url'>
<span
expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a
expr:dir='data:blog.languageDirection'
expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if
cond='data:showFreqNumbers'>
<span
class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>
<b:include
name='quickedit'/>
</div>
</b:includable>
</b:widget>
For display widget only on Home page :
modified code by adding a simple two line code. Additional code is highlighted by yellow color.
<b:widget id='Label1' locked='false' title='Labels'
type='Label'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if
cond='data:title != ""'>
<h2><data:title/></h2>
</b:if>
<div
expr:class='"widget-content " + data:display +
"-label-widget-content"'>
<b:if
cond='data:display == "list"'>
<ul>
<b:loop
values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url ==
data:label.url'>
<span
expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a
expr:dir='data:blog.languageDirection'
expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if
cond='data:showFreqNumbers'>
<span
dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop
values='data:labels' var='label'>
<span
expr:class='"label-size label-size-" +
data:label.cssSize'>
<b:if
cond='data:blog.url == data:label.url'>
<span
expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a
expr:dir='data:blog.languageDirection'
expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if
cond='data:showFreqNumbers'>
<span
class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>
<b:include
name='quickedit'/>
</div>
</b:if>
</b:includable>
</b:widget>
Detail:
Add <b:if cond='data:blog.url == data:blog.homepageUrl'> below the <b:includable id="main">
And
Add </b:if> above the </b:includable></b:widget>
After modify this code save the template. Now label widget only display on the homepage only.
Similarly,
For hide widget only on Homepage:
Add <b:if cond='data:blog.url != data:blog.homepageUrl'> below the <b:includable id='main'>
And
Add </b:if> above the </b:includable></b:widget>
And
Add </b:if> above the </b:includable></b:widget>
For show widget only on post pages:
Add <b:if cond='data:blog.pageType == "item"'> below the <b:includable id='main'>
And
Add </b:if> above the </b:includable></b:widget>
And
Add </b:if> above the </b:includable></b:widget>
For hide widget only on post pages:
Add <b:if cond='data:blog.pageType != "item"'> below the <b:includable id='main'>
And
Add </b:if> above the </b:includable></b:widget>
And
Add </b:if> above the </b:includable></b:widget>
For show widget only on particular page:
Add <b:if cond='data:blog.url == "here put the link of page"'> below the <b:includable id='main'>
And
Add </b:if> above the </b:includable></b:widget>
And
Add </b:if> above the </b:includable></b:widget>
For hide widget only on particular page:
Add <b:if cond='data:blog.url != "here put the link of page"'> below the <b:includable id='main'>
And
Add </b:if> above the </b:includable></b:widget>
And
Add </b:if> above the </b:includable></b:widget>
Comments
Post a Comment