Templating

Output a Mason field using its field tag.

Everything is pre-rendered to safe HTML.

Full Render#

{mason_field}

This renders the whole document — rich text and every enabled brick — as HTML.

Disabled bricks are skipped, and the field's editor mode is respected.

Looping Bricks#

Iterate the bricks yourself for full control over the markup:

{mason_field}
  {bricks}
    {if brick_type == "callout"}
      <div class="callout {brick:tone}">{brick:heading}</div>
    {if:elseif brick_type == "quote"}
      <blockquote>{brick:quote} — {brick:cite}</blockquote>
    {/if}
  {/bricks}
{/mason_field}

Inside {bricks}:

• {brick_type} — the brick's short name.
• {brick:short_name} — a field's value.
• {if brick_type == "..."} — conditionals on the brick type.

Sub-Values#

Some field kinds expose additional tokens.

Link#

{brick:short_name:url}
{brick:short_name:text}
{brick:short_name:target}

File#

{brick:short_name:url}
{brick:short_name:title}

Entry#

{brick:short_name:id}
{brick:short_name:title}
{brick:short_name:url_title}

Every custom field on the related entry is also available by its short name:

{brick:short_name:field}

File fields resolve to a URL.

For a multi-pick Relationship, loop it:

{brick:short_name}
    ...
{/brick:short_name}

The same per-entry tokens resolve for each row.

Grid Rows#

Loop a Grid using its short name. Each column's short name resolves per row:

{brick:items}
  <li>{brick:list_item}{if done} &check;{/if}</li>
{/brick:items}

Get the number of rows with:

{brick:items:count}

Listing (Channel Query)#

A Listing field loops live channel entries using the same syntax as a Grid.

Each row exposes:

• id
• title
• url_title
• url
• formatted date
• every custom field on the entry by its short name

The url value is built using the field's Link prefix.

File fields resolve to a URL.

Example:

<div class="grid">
  {brick:projects}
    <a href="{brick:url}" class="card">
      {if project_cover}
        <img src="{brick:project_cover}" alt="{brick:title}">
      {/if}

      <h3>{brick:title}</h3>
      <time>{brick:date}</time>

      {if project_excerpt}
        <p>{brick:project_excerpt}</p>
      {/if}
    </a>
  {/brick:projects}
</div>

Get the number of returned entries with:

{brick:projects:count}

In this example, projects is the Listing field's short name, while project_cover and project_excerpt are custom fields on the listed channel.

Braces in Authored Content#

ExpressionEngine's template parser reads the output a fieldtype returns.

A literal { typed into a Mason field would otherwise be treated as the beginning of an EE tag. Content quoting EE syntax could therefore break the page rendering it.

Mason outputs literal braces from authored content as:

{
}

Browsers display these as ordinary braces, so an author can write documentation, tutorials, or JSON snippets containing { and they render exactly as typed.

The consequence is that EE tags typed into a Mason field are displayed rather than executed.

For example, writing:

{exp:channel:entries}

in the editor displays that text on the page.

Template logic belongs in your templates and brick partials, where {brick:short_name} tokens resolve normally.

This escaping only affects braces in content typed by an author.

Custom Brick Markup#

For advanced control, drop a file at:

templates/bricks/<brick_short_name>.html

inside the add-on.

This lets you fully control a brick's full-render markup.

Use the same {brick:short_name} tokens and Grid loops inside the file.