How To Display/Hide Blogger Widgets With Conditional Tags

hide-show-blogger-widgets-conditional-tags
Blogger is best and free platform for creating blog. If you are blogger you may hear about other professional CMS platforms like WordPress, Joomla and more but we always have mindset that blogger having limited accessibility as compare other famous CMS platform but actually its not so true. Just like WordPress we can design a great theme into blogger also even our safe tricks blog is at blogger. But to make your blog attractive you need to learn some important techniques which help for better customization in blogger.
In blogger every person want to make their blog good in look wise but the major problem faced by blogger is when we want to use some gadgets or widgets to show or hide for particular pages. To Hide or show any widget according to pages, post, homepage or other specific pages is done by conditional tag. These conditional statement allows you to show and hidden any field on different pages. So if you want to hide or display any widget or even full portion then simply choose conditional statement according to your requirement. 


Important Conditional Tags For Blogger


Below given tag perform their functioning according to their condition. Just like if you add homepage conditional tag then it allow that section to display only on homepage and hide from another. If the same ways you can show anything whatever you want to display on homepage, posts, pages, search pages, labels, archives or even only at single particular path. These tags are very useful in these type of situations.

#1 To Show Widget or Any Portion only at Homepage


<b:if cond='data:blog.url == data:blog.homepageUrl'>
 Your Section or Widget portion here
</b:if>

If you want to display anything just like any widget or even whole sidebar, footer or header section just only at homepage then simply.


#2 To Show Widget or Any Portion only at Particular page


<b:if cond='data:blog.url == "URL of the page"'>
 Your Section or Widget portion here
</b:if>

This conditional tag is used when you want to show anything just only at particular page to use this simply replace URL of the page this portion with URL of the post or page.



#3 To Show Widget or Any Portion only at Post and Pages only


<b:if cond='data:blog.pageType == "item"'>
 Your Section or Widget portion here
</b:if>

If you want to display anything only at post and pages and want to hide from homepage, archive and other search pages then this conditional tag works for you.


#4 To Show Widget or Any Portion only at Label Pages


<b:if cond='data:blog.searchLabel'>
 Your Section or Widget portion here
</b:if>

If you want to display anything only at label pages and want to hide from homepage, post, pages and other pages then use above label conditional tag.


#5 To Show Widget or Any Portion only at Archive Pages


<b:if cond='data:blog.pageType == "archive"'>
 Your Section or Widget portion here
</b:if>

If you want to display anything only at archive pages and want to hide from homepage, post, pages and other pages then use above archive conditional tag.


#6 To Show Widget or Any Portion only at Static pages


<b:if cond='data:blog.pageType != "static_page"'>
 Your Section or Widget portion here
</b:if>

This above conditional tag make your widget or any portion working for static pages and hide from all other non static pages of your blog.


#7 To Show Widget or Any Portion only at Post and Static pages


<b:if cond='data:blog.url == data:post.url'>
 Your Section or Widget portion here
</b:if>

This above conditional tag make your widget or any portion working for post pages and static pages only and hide from all other pages except post and static pages of your blog.

How to use these conditional tags ?


<b:if cond = 'Your Condition here'>
Your Section or Widget portion here
 </b:if>

Above given are few conditional tags which i find useful otherwise there are number of conditional tags available if have little bit knowledge in programming then it will easy for to understand this. All the condition will comes just in the place for Your Condition here and paste below codes.

Suppose you want to use these condition for any section so put that section like

<b:if cond = 'Your Condition here'>
<div class="name">
</div>

OR

<b:widget id="name" locked="false" title="name" type="HTML">
</b:widget>

</b:if>

Above given piece of codes just a format don't use these codes in same way. Simply add conditional tag given above according to their type

Few other conditions 


1. data:blog.pageType == "index"    (For collective content pages like home, archive, label)

2. data:blog.searchQuery                 (For Search query pages where result displays)

3. data:post.isFirstPost                     (For First post only)

4. data:blog.pageType == "error_page"   (For error pages with response code 404)

These are few other condition tags which you can also use in same way.

Reverse Your condition


<b:if cond='data:blog.url == data:post.url'>
</b:if>

In case you want to reverse your condition then you can replace  == with  != 

==  is for when statement is equal to condition to make comparison 

!=  is for when statement is  not equal to condition to make comparison. 

 Need Help regarding this topic?


I hope your all doubt related blogger conditional tags and their usage should be cleared. In case i have missed out any important condition or even i explained it wrong must share your ideas or even if you face any problem while implementation of above codes. I will always be here to help you :)

Post a Comment

0 Comments