In Previous Post We Learn How To Add a Widget/Gadget in Blogger Blog.When You Added a New Widget It Will be Appears on All Posts, pages included Home Page.
Now in This Session We Learn How to Add a Widget or Gadet to Show or Hide in Home, Post, Page, Static, or Archive.Many Times We Want to Add Widgets/Gadgets Should be Appears on our Blogger's Main Page but Don't Show on Other Posts and Pages or They will Only Shown on Posts / Pages or Only Show on Selected Posts or Pages.This Purpose Helps You to Show or Hide Your Widgets or Gadgets as per Your Desire.
Now in This Session We Learn How to Add a Widget or Gadet to Show or Hide in Home, Post, Page, Static, or Archive.Many Times We Want to Add Widgets/Gadgets Should be Appears on our Blogger's Main Page but Don't Show on Other Posts and Pages or They will Only Shown on Posts / Pages or Only Show on Selected Posts or Pages.This Purpose Helps You to Show or Hide Your Widgets or Gadgets as per Your Desire.
![]() |
To Hide or Show Widgets in Particular Posts, Static Pages, Homepage or Archive Pages Just Add Conditional Tags.
Lets Know How to Do This:
Related Post: You can also hide blogger widgets using simple CSS code.....
Step 01: Go to Blogger's Dashboard > Layout and Name Your Html/Javascript Widget or Gadget You Already Added Its Help You to Find it in HTML.
Step 02: Next is Go to Template and Click on HTML.
Step 03: Click Anywhere in the Code Area and Press CTRL+F Keys to Open the Search Bar.
Step 04: Write your Widget Name to Find Widget HTML and Press Enter.
Let's Say That the Title of One of my Widget is "POPULAR POSTS". After Searching Widget Name We can See the HTML of Similar Widget.
This Code Represent My Widget/Gadget i Added in My Layout.
Step 05: After Found the HTML Code of Your Widget Just Add the Conditional Tags Marked with Blue Below and Above to Hide the Widget from Specific Pages or Posts in Blogger.
To Show the Widget Only in Homepage:
To Show the Widget Only in Post Pages:
Lets Know How to Do This:
Related Post: You can also hide blogger widgets using simple CSS code.....
Step 01: Go to Blogger's Dashboard > Layout and Name Your Html/Javascript Widget or Gadget You Already Added Its Help You to Find it in HTML.
Step 02: Next is Go to Template and Click on HTML.
Step 03: Click Anywhere in the Code Area and Press CTRL+F Keys to Open the Search Bar.
Step 04: Write your Widget Name to Find Widget HTML and Press Enter.
Let's Say That the Title of One of my Widget is "POPULAR POSTS". After Searching Widget Name We can See the HTML of Similar Widget.
<b:widget id='HTML1' locked='false' title='Popular Posts' 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>
</b:widget>
Step 05: After Found the HTML Code of Your Widget Just Add the Conditional Tags Marked with Blue Below and Above to Hide the Widget from Specific Pages or Posts in Blogger.
To Show the Widget Only in Homepage:
<b:widget id='HTML1' locked='false' title='Popular Posts' 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 != ""'>
<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>
<b:widget id='HTML1' locked='false' title='Popular Posts' type='HTML'>To Hide the Widget Only in Post Pages:
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<!-- 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>
</b:widget>
<b:widget id='HTML1' locked='false' title='Popular Posts' type='HTML'>To Show the Widget Only in Specific Page:
<b:includable id='main'>
<b:if cond='data:blog.pageType!= "item"'>
<!-- 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>
</b:widget>
<b:widget id='HTML1' locked='false' title='Popular Posts' type='HTML'>Note: Replace URL of Page with the Address of the page in which you want the widget appear.
<b:includable id='main'>
<b:if cond='data:blog.url == "URL of the page"'>
<!-- 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>
</b:widget>
To Hide the Widget Only in Particular Page:
<b:widget id='HTML1' locked='false' title='Popular Posts' type='HTML'>To Show the Widget Only in Static Page:
<b:includable id='main'>
<b:if cond='data:blog.url != "URL of the page"'>
<!-- 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>
</b:widget>
<b:widget id='HTML1' locked='false' title='Popular Posts' type='HTML'>To Hide the Widget Only in Static Page:
<b:includable id='main'>
<b:if cond='data:blog.pageType == "static_page"'>
<!-- 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>
</b:widget>
<b:widget id='HTML1' locked='false' title='Popular Posts' type='HTML'>To Show the Widget Only in Archive Page:
<b:includable id='main'>
<b:if cond='data:blog.pageType != "static_page"'>
<!-- 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>
</b:widget>
<b:widget id='HTML1' locked='false' title='Popular Posts' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "archive"'>
<!-- 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>
</b:widget>
Note . Pay attention each time you're adding a new address which should end up with .com, otherwise it may not work.
Step 6. After you have added the conditional tags, Save Template and view your blog.
That's it!
Post a Comment