Blogger cond Attribute: Complete Conditional Guide - KodeRian

Want your Blogger template to feel smart—showing the right widget at the right time, hiding clutter when it’s not relevant, and tailoring layouts for posts, pages, labels, and search results? That’s exactly what the cond (conditional) attribute is for. It’s a compact switch you can attach to Blogger template tags to decide when a block should render. With cond, your theme becomes flexible, faster to scan, and easier to maintain.

This deep-dive explains how cond works, what it can evaluate, and how to combine it with Blogger’s data model (data:view, data:post, etc.). You’ll get copy-ready snippets, real-world conditions for common pages, and a troubleshooting checklist so you can ship confidently.

What Is the cond Attribute?

cond is a Boolean expression (true/false) that you attach to Blogger’s template tags. If the expression evaluates to true, the element renders; if false, Blogger skips it during server-side rendering.

Basic Syntax

cond='{expression}'

You’ll typically use cond with these Blogger template tags:

Tag	What it controls	Is cond required?
<b:if>, <b:elseif>	Executes enclosed children when condition is true.	Required on these tags
<b:widget>	Shows/ hides the widget and its content.	Optional
<b:section>	Shows/ hides an entire section and its widgets.	Optional
<b:include>	Controls whether an includable is injected.	Optional
<b:class>	Adds a class to the parent only when true.	Optional
<b:attr>	Adds an attribute to the parent only when true.	Optional
<b:tag>	Renders a raw HTML tag conditionally.	Optional

Return types: Any expression that yields a Boolean or “truthy/falsy” value can drive cond. That includes explicit booleans, Blogger data fields, comparisons, logical operations, membership checks, and even lambda expressions.

Quick Wins: Common Page-Type Conditions

Blogger’s newer templates revolve around data:view (older themes often use data:blog). Here are the most useful flags:

• Single post article: cond='data:view.isPost'
• Static page: cond='data:view.isPage'
• Homepage: cond='data:view.isHomepage'
• Any search results: cond='data:view.isSearch'
• Listing views (multiple items): cond='data:view.isMultipleItems'
• Single item (post or page): cond='data:view.isSingleItem'

Step-by-Step: Add a Conditional Widget

1. Pick the element to control. For example, a “Related Posts” widget you only want on single posts.
2. Attach a condition. Use the appropriate data:view flag.
3. Test on multiple views. Verify homepage, label pages, search, and item pages.

Example: Show a Widget Only on Single Posts

<b:widget id='Related1' type='HTML' title='Related Posts'
  cond='data:view.isPost'>
  <!-- widget content -->
</b:widget>

Example: Show a Banner on Homepage and Label Pages Only

<b:widget id='HeroBanner' type='HTML' title='Hero'
  cond='data:view.isHomepage or data:view.isLabelSearch'>
  <!-- hero markup -->
</b:widget>

Deeper Explanation: What Can cond Evaluate?

1) Explicit Boolean

Hard-code true/false when toggling during development.

cond='true'
cond='false'

2) Data-Backed Boolean

Leverage the view context from data:view (new) or data:blog (legacy).

cond='data:view.isPost'
cond='data:view.isPage'
cond='data:view.isHomepage'
cond='data:view.isSearch'
cond='data:view.isMultipleItems'
cond='data:view.isSingleItem'

3) Comparisons & Logic

Combine conditions with and, or, not, and comparison operators (==, !=, lt, lte, gt, gte).

cond='data:posts.size gt 10'                 
cond='data:view.isSearch and not data:view.isLabelSearch'
cond='data:view.search.label contains "+"'

4) Membership & Inclusion

Check if a value is inside a set (array):

cond='data:view.search.query in ["Tips","Tutorial","Blog"]'
cond='data:view.postId in [{123456},{789012}]'

5) Lambda Expressions

Run a concise test across an array of items.

cond='data:posts all (p => p.labels.any)'   

Targeting Specific Pages, Posts, and Labels

Sometimes you need to hit a precise item: a single post, a list of posts, or a search for a known label/query.

Match a Specific Post/Page

cond='data:view.postId == {123456}'
cond='data:view.pageId == {123456}'

Target Multiple Posts/Pages

cond='data:view.postId in [{111111},{222222},{333333}]'
cond='data:view.pageId in [{444444},{555555}]'

Within Post Loops (Blog / FeaturedPost / PopularPosts)

cond='data:post.id == {123456}'
cond='data:post.id in [{123456},{789012}]'

Search Views

cond='data:view.search.query == "how to"'
cond='data:view.search.label == "Tutorial"'
cond='data:view.search.query in ["css","html","javascript"]'
cond='data:view.search.label in ["Tips","Review"]'

Archive Pages

cond='data:view.search.archive.year == 2018 and data:view.search.archive.month == 02'

Design Patterns You’ll Reuse

Conditional Sections

Wrap entire regions to keep your theme tidy across contexts.

<b:section id='promo' showaddelement='no'
  cond='data:view.isHomepage'>
  <b:widget id='HTML_Promo' type='HTML' title='Promo' />
</b:section>

Conditional Includes

Only inject partials (includables) when you need them.

<b:include name='shareButtons' cond='data:view.isSingleItem' />

Conditional Classes

Add classes to the parent element only when a condition is met.

<div class='card'>
  <b:class cond='data:view.isPost' name='card--post' />
  <b:class cond='data:view.isSearch' name='card--search' />
</div>

Conditional Attributes

Attach ARIA or data-attributes as needed.

<button class='btn'>
  <b:attr cond='data:view.isHomepage' name='aria-current' value='page' />
</button>

Performance & UX Considerations

• Server-side render: cond runs before the page reaches the browser. Hidden sections aren’t just visually hidden—they’re not in the DOM at all, which keeps pages lighter.
• Avoid double-loading: If you also use JavaScript to toggle, ensure you’re not recreating content that cond has filtered out.
• Consistent spacing: When a block can disappear, make sure surrounding CSS doesn’t leave awkward gaps. Use utility wrappers or responsive layout rules.
• Accessibility: If content is essential for navigation (e.g., breadcrumbs), avoid hiding it entirely; prefer simplified, context-aware versions.

Advanced Use Cases

Show Different Hero per Context

<b:if cond='data:view.isHomepage'>
  <b:include name='hero.home' />
<b:elseif cond='data:view.isLabelSearch' />
  <b:include name='hero.label' />
<b:elseif cond='data:view.isPost' />
  <b:include name='hero.post' />
</b:if>

Gate a “Subscribe” Box to Search Pages with Query

<b:widget id='Subscribe1' type='HTML'
  cond='data:view.isSearch and data:view.search.query'>
  <!-- subscribe form -->
</b:widget>

Only Show “Read Next” When There Are Enough Posts

<b:include name='readNext' cond='data:posts.size gte 6' />

Feature Posts with Specific Labels (Inside Loops)

<b:if cond='data:post.labels any (l => l.name == "Featured")'>
  <span class='badge badge--featured'>Featured</span>
</b:if>

FAQ

Do I need cond on <b:if>?

Yes. For <b:if> and <b:elseif>, cond is required. For other tags (widgets, sections, classes, attrs), cond is optional but useful.

What’s the difference between data:view and data:blog?

data:view is the newer, “universal” context used by modern themes. Older templates often rely on data:blog. When possible, prefer data:view.

Can I combine multiple conditions?

Absolutely. Use logical operators (and, or, not) and comparisons. Keep expressions readable or split logic with <b:if>/<b:elseif>.

Will this hurt performance?

No. Conditions are evaluated server-side; hidden blocks aren’t sent to the browser. That usually improves performance by reducing DOM size.

Can I check label names and search queries?

Yes. Use data:view.search.label and data:view.search.query, along with operators like contains or in.

Troubleshooting

• Condition never matches: Double-check the exact property name (isHomepage vs isHomePage), and confirm you’re using data:view in a modern template.
• Nothing renders in a section: A parent’s cond='false' will suppress all children. Check for cond on wrappers, not just widgets.
• Works on posts but not pages: Some fields exist only in specific contexts. Use ternaries or alternate checks for pages vs posts.
• Label conditions fail: Ensure you’re actually on a label search URL and the label name matches case/spacing. Test with a simple contains first.
• Archive logic off by one: Months are typically two-digit. Pad with a leading zero (02 for February).

Copy-Ready Snippets

Show Sticky Notice Only on Homepage

<b:widget id='NoticeHome' type='HTML' title='Notice'
  cond='data:view.isHomepage'>
  <div class='notice'>Welcome to our site!</div>
</b:widget>

Hide Sidebar on Static Pages

<b:section id='sidebar' cond='not data:view.isPage'>
  <b:widget id='Profile1' type='Profile'/>
  <b:widget id='Archive1' type='BlogArchive'/>
</b:section>

Add Extra Class on Search Results

<main class='content'>
  <b:class cond='data:view.isSearch' name='content--search' />
  <!-- rest of layout -->
</main>

Target Specific Post IDs in Loops

<b:if cond='data:post.id in [{111111},{222222},{333333}]'>
  <span class='badge badge--vip'>VIP</span>
</b:if>

Only Show Share Buttons When There’s a Title

<b:include name='share' cond='data:post.title' />

Putting It All Together (Mini Layout)

<!-- Header always visible -->
<b:section id='header' showaddelement='yes'>
  <b:widget id='Header1' type='Header'/>
</b:section>

<!-- Homepage hero only on homepage or label searches -->
<b:include name='hero' cond='data:view.isHomepage or data:view.isLabelSearch' />

<!-- Main content -->
<div class='wrap'>
<main class='content'>
<b:widget id='Blog1' type='Blog'/>
</main>

<aside class='sidebar'>
<b:section id='sidebar' cond='not data:view.isPage'>
<b:widget id='Popular1' type='PopularPosts'/>
<b:widget id='Labels1' type='Label'/>
</b:section>
</aside>
</div>

<!-- Footer only when there are enough items -->
<b:include name='footer' cond='data:posts.size gte 4' />

Conclusion

The cond attribute is small but mighty. With a single Boolean expression, you can tailor entire sections, widgets, and classes to the current context—post vs page, homepage vs label results, specific IDs, queries, and more. Keep your conditions readable, prefer the modern data:view API, and test across views. Your reward is a cleaner UI, faster pages, and a template that’s easier to maintain and iterate on.

Found this useful? Please bookmark this guide, share it with other Blogger builders, and subscribe to catch the next deep-dive on template expressions and performance patterns.