Template Syntax

Learn how to use variables, conditionals, loops, and helpers in your templates

Variables

Use double curly braces to insert variables:

<h1>{{page.title}}</h1>
<p>{{description}}</p>
<span>Language: {{currentLang}}</span>

Access page properties and block props with dot notation

Conditionals

Show content conditionally with #if blocks:

{{#if showButton}}
  <button>{{buttonText}}</button>
{{/if}}

{{#if user}}
  <p>Welcome, {{user.name}}!</p>
{{#else}}
  <p>Please log in</p>
{{/if}}

Use {{#if}} for conditional rendering with optional {{#else}}

Loops

Iterate over arrays with #each:

<ul>
{{#each items}}
  <li>
    {{title}} - {{description}}
    {{#if @first}}(First item){{/if}}
    {{#if @last}}(Last item){{/if}}
  </li>
{{/each}}
</ul>

Loop variables @index, @first, and @last are available inside loops

Helper Functions

StaticBlocks provides several built-in helpers:

Translation Helper

<!-- Full syntax -->
{{translate:nav.home}}

<!-- Short alias -->
{{t:buttons.submit}}

Access translations from locale files

Active Navigation

<a href="/about/" class="{{active:/about/}}">
  About
</a>

Add 'active' class to current page links

URL Helpers

<!-- With language prefix -->
<a href="{{url:/contact/}}">Contact</a>

<!-- Asset URLs -->
<img src="{{asset:/images/logo.png}}">

<!-- Current year -->
<p>&copy; {{year}} Company</p>

Helpers for URLs, assets, and dynamic content