Hiding Widget in a Specific Page.

Today we are going to hide or display widget(Gadget) in specific pages like Homepage,Post(item)page,Index page(which includes homepage,label page and yearly archive page).You may have also option not to show in homepage or archive page etc. and show widget in other page.This can be done easily with Blogger Conditionals Tag.Lets Do it.

We will do this steps in this way

  1. Finding Widget Id.
  2. Using appropriate conditional tag
  3. Showing/Displaying widget in a specific Pages.

Finding Widget Id.

This is the most important steps.Every widget(Gadget) are given distinct Id so that we can apply CSS coding.If you don’t know how to  find widget id click here.

Using Appropriate Conditional Tag.

Conditional Tag is the main part because hiding or displaying of widget is related with this.Corresponding conditionals tag are.

  1. To show in Index Page(Homepage,label and yearly archive page).
    <b:if cond='data:blog.pageType == "index"'>
  2. To Show In Only in Homepage
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
  3. To Show in Label page
    <b:if cond='data:blog.searchLabel'>
  4. To Show in Static Page
    <b:if cond='data:blog.pageType == "static_page"'>
  5. To Show in Specific Url .
    <b:if cond='data:blog.url == "PUT_URL_HERE"'>

For Showing in all page except index page use this.

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

To show except item(Post) You use Static_page etc to now to show in that page only.You can see I have used ! which means is not equal to.

Applying in Blogger.

  1. Go to Blogger.com
  2. Click in Template or Design
  3. Click on “Edit HTML”
  4. Tick On Expand Widget.
  5. Find this similar to Yours
    <b:widget id='WidgetId' locked='false' title='WidgetTitle' type='HTML'>
    <b:includable id='main'>
      <!-- only display title if it's non-empty -->
      <b:if cond='data:title != &quot;&quot;'>
        <h3 class='title'><data:title/></h3>
      </b:if>
      <div class='widget-content'>
        <data:content/>
      </div>
    
      <b:include name='quickedit'/>
    </b:includable>
    </b:widget>
  6. Where
  7. In Line 1 WidgetId must be replaced with yours before finding widget.
  8. Replace the step 5 with this
    <b:widget id='WidgetID' locked='false' title='Widget title' type='HTML'>
    <b:includable id='main'> 
    Add The Appropriate Condional Tag Here
      <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:else/>
    <style type='text/css'>
    #WidgetID {display:none;}
    </style>
    </b:if> 
    </b:includable> 
    </b:widget>
  9. Add
    1. Line 3 after <b:includable id='main'>
    2. Line 11,12,13,14,15 just before </b:includable>  of respective widgets
    3. Replace the add code with below tweaks.
  10. Where
    1. In Line 1 replace widget id and widget title with yours.
    2. Replace Line 3 With Appropriate conditional Tags
    3. Replace line 13’s “WidgetId” with your own.
    4. Line 15 is the end tag of conditional tag so it is not necessary.
  11. Have you got victory in this.
  12. Bye—

Note this may not work in some widgets.

Subscribe At free
Thank you for visiting FacebookSinker.blogspot.com. Please don't miss any of the updates by subscribing to our RSS feed or email updates.

2 comments:

 
back to top