Make widgets contents appear or hide in specific pages of blogger

If you are a follower of my blog you might have already noticed it. I've hidden parts of my blog sections which they will appear only on my homepage and static pages.

In this post I am going to present you the various conditional tags code. You can utilise them in blogger template to show or hide your widget/section or ad in the specific pages. Of course, to implement these code you'll need to have a bit of coding knowledge.

And there maybe plenty of reasons to why some of you want to have selective display of widgets in blog posts or homepage.
But if you are looking for ways to optimise your blog loading speed, then look no further!
Believe me all you need to do is.. Just hide your widgets when is not required!
This is a simple solution to improve your page speed performance.


Without further ado let me go though the basics then the list of conditional tags blogspot.com offers.

Understanding the conditional syntax

<b:if cond=' Mr Durian'>

Headphones
</b:if>

(Yellow) opening of conditional tag.

(Green) the condition at which you define.

(Blue) the content you want to hide or show.

(Yellow) closing tag of the condition. 

What the code mean?..It meant..

If condition equals to Mr Durian, headphones will be displayed..

This is just the really basic principle behind. 

List of conditional tags

Content only appear on homepage
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Content ads/widget that will be shown only on homepage
</b:if>
Content appear on other pages except homepage
<b:if cond='data:blog.url != data:blog.homepageUrl'>
Content ads/widget that will not be shown on homepage
</b:if>
Content only appear on Post Pages
<b:if cond='data:blog.pageType == "item"'>
Content ads/widget that will be shown only on post pages
</b:if>
Content appear on other pages except Post Pages
<b:if cond='data:blog.pageType != "item"'>
Content ads/widget that will not be shown on post pages
</b:if>

Looking at the examples above you should have somehow understood the difference between "==" and "!=". Therefore for the following codes I won't be showing you the "not equal (!=)" conditions.

Content only appear on Index pages (homepage, label search page and archive page)
<b:if cond='data:blog.pageType == "index"'>
Content ads/widget that will be shown on homepage, labels page and archive page
</b:if>
Content only appear on Static Pages
<b:if cond='data:blog.pageType == "static_page"'>
Content ads/widget that will be shown only on static pages
</b:if>
Content only appear on Archive Pages
<b:if cond='data:blog.pageType == "archive"'>
Content ads/widget that will be shown only on archive pages
</b:if>
Content only appear on Label Search Pages
<b:if cond='data:blog.pageType == "data:blog.searchLabel"'>
Content ads/widget that will be shown only on label search pages
</b:if>

Also if condition is not met, you can have an alternate content by inserting the <b:else/> tag between.
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Content ads/widget that will be shown only on homepage
<b:else/>
Content ads/widget that will be shown on other pages except homepage
</b:if>

Advance coder? There are many more tags you can assign and manipulate.
Refer to Layouts Data Tags