Thursday, June 7, 2012

How To Show Blogger Gadget/ Widget In Specific Pages

In this tutorial im going to explain How To Show
Blogger Gadget/ Widget In Specific Pages. When we designing the
blogger templates. sometime we want to change out gadget/
widget.Sometime need to show gadget/ widget homepage
only.some time inside post only. At that time we don't have
any option for customize like that. We need to understand
about code.But most of are not good at coding.So in this
tutorial will helps to arrange your gadget/ widget as you want.
follow these steps.


blogger-gadget
1. Log in to blogger account and Go to Design >> Edit HTML
    (make sure backup your template first)

2. Put checked mark in Expand Widget Templates

3. Now you have to press  Ctrl+F  key and type the unique  title that you gave to gadget or widget.
Lets say you gave title as Subscribe, the code will show like this.

<b:widget id='HTML1' locked='false' title='Subscribe' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>

So,code start with <b:includable id='main'>  and end with </b:includable>
you have to find this both code.
lets see how to show this gadget in specific pages.

How to show blogger gadget in home page and other pages.(Except post pages.)

So,show gadget in home page and other pages.You have to add that red code like below.
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>

How to show blogger gadget in Post pages only.

<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>

How to show blogger gadget in only specific page


<b:includable id='main'>
<b:if cond='data:blog.url == &quot;URL of the page&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>

you can replace URL of the page with URL which you want to show the gadget only that page.

7. Now save your template
 you are done.

3 comments:

  1. Thanks, good info! I'm now following your site. Feel free to follow my airline adventure blog at:

    capnaux.blogspot.com

    ReplyDelete
  2. @Blogger Tricks
    You are welcome

    ReplyDelete