Use of Blogger Conditional Tags for Different Page Types

You may see this <b:if cond=’ ‘>…</b:if> type of code in your blogger theme. This is called a conditional tag. Here I’ll show what amazing you can do with blogger conditional tags.

Let’s know blogger conditional tags secrets.

What are conditional tags?

Conditional tags allow you to show specific content on a specific page of your blog or website. You can show or hide specific widgets, codes, content or any other part of the template in a specific URL or condition. Conditional tags are similar to any other language.

This includes tags such as “IF, ELSE”. If type conditional tag can be done by using <b:if cond=’ ‘>…</b:if> tag and this is used to display a specific content on certain condition.

Else type conditional tag is done by <b:else/> and is used for other conditions. In this post, I have shown the most used conditional tags with examples.

Let’s know some common uses of conditional tags in Blogger.

Use of Conditional Tags

On Home Page

To display a text message or any content only on the home page we use

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<p> This text will be displayed only on home page</p>
</b:if>

And to display it everywhere except the homepage,

<b:if cond='data:blog.url != data:blog.homepageUrl'>
<p>This text will be displayed everywhere except on home page</p>
</b:if>

If you like to display a widget only on the home page, use the red coloured conditional tag below as highlighted on the following code for a blogger HTML/Javascript widget. You can use any other conditional tags you like instead of the homepage.

<b:widget id='HTML1' locked='false' title='Testing Widget' 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 != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:if> <b:include name='quickedit'/>
</b:includable>
</b:widget>

On Archive Page

Archive pages are category/label pages, and search pages. When you want to show content on this type of page, use the following tag. To display only on the archive page

<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<p>Text for Archive pages only</p>
</b:if>

To display content everywhere except the archive page, use the following code.

<b:if cond='data:blog.pageType != &quot;archive&quot;'>
<p>Text for everywhere except Archive pages</p>
</b:if>

On Item/Post Page

Item pages or Post pages are your blog post pages. To show content only on the item page.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p>Text for post pages only</p>
</b:if>

To display HTML code everywhere except the item page.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<p>Text for everywhere except item pages</p>
</b:if>

On Static Page

Static Pages are those pages you create from the Pages option from the blogger dashboard. These pages can be created for About/Contact/Privacy or other important pages.

To display HTML code only on static pages, you can use this.

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<p>Text for static pages only</p>
</b:if>

To display HTML code everywhere except on static pages.

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<p>Text for everywhere except static pages</p>
</b:if>

On Specific URL

You may want to show a widget/text on a specific page. Just use the following conditional tag.

To display only on a specific URL, use the following code and paste your Page URL instead of the bold URL.

<b:if cond='data:blog.url != &quot;http://www.yourdomain.com/page-url.html&quot;'>
<p>Text will display on above URL only</p>
</b:if>

On Certain Labels

To display content on certain labels only

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == &quot;Testing Category&quot;'>
Text will be displayed only on Posts which have label Testing Category.
</b:if>
</b:loop>

Use of Else Conditional Tag

We use the else conditional tag to show content on other conditions than the if condition. See the below codes.

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>

Here, Blog Title will be displayed on the index page and the Page Title will be displayed on other pages. Hope you understood the use of the else conditional tag.

These are the most used conditional tags. Hope you need them.

Don’t hesitate to ask any questions in the comment. Wish you all the best in your blogging journey.

To know more about WordPress and Blogger theme customization, see the following,