Skip to main content

Condition

{% if %}Shows or hides content based on an expression.

This page covers how the Condition block works — what it does, how to set it up, and how to handle the false case.

The Condition block wraps other blocks and shows them only when an expression is true. If the expression is false, the content is not rendered in the HTML at all.

Condition block panel showing a post.thumbnail expression

How it works

You type an expression in the Condition block's sidebar panel. In the HTML inspector, this becomes a {% if %} / {% endif %} wrapper:

{% if post.thumbnail %}
<img src="{{ post.thumbnail.src }}" alt="{{ post.thumbnail.alt }}">
{% endif %}

The condition is only evaluated on the frontend. Inner blocks are always visible in the editor so you can build and style them normally.

Basic examples

Check if a value exists:

{% if post.thumbnail %}
{% if post.excerpt %}

Check if a value matches:

{% if post.category.slug == 'featured' %}
{% if user.id %} {# user.id is 0 for guests #}

Combine multiple checks:

{% if user.id and 'editor' in user.roles %}

See Condition expressions for the full list of operators, nesting, and how to use dynamic data inside conditions.

Handling the false case

There is no {% else %} in Condition blocks. To handle both cases, use two Condition blocks with opposite expressions:

{% if post.excerpt %}
<p class="excerpt">{{ post.excerpt }}</p>
{% endif %}

{% if not post.excerpt %}
<p class="excerpt">{{ post.content|truncate(150) }}</p>
{% endif %}
Common mistake

Because there is no else, it's easy to forget the opposite case. Your visitors will see nothing when the condition is false — no fallback, no placeholder, just blank space. Always ask yourself: "What should show when this is false?"

Next steps