Tags vs. Variables


In Antlers templates there are two types of generic “tags”. Simple variables, and Tags (a proper noun). They can both render things in your templates, so what’s the difference, exactly?

The TL;DR version

Variables simply render existing data. Tags can “do things”.

Understanding Antlers

The first step to really understanding the difference is to understand the basics of how Antlers works.

On a high level, we pass an array of data along with a template, and then parse it, replacing your tags with variables of the same name, if any are found. It might look something like this:

$variables = [
    'favorite' => 'bacon',
    'brands' => [
        ['name' => 'Lagavulin', 'location' => 'Scotland'],
        ['name' => 'Jameson', 'location' => 'Ireland'],
  ]
];

$template = '
    My favorite food is {{ favorite }}.
    Here are some whisky brands:
    {{ brands }}
    {{ name }} from {{ location }}
    {{ /brands }}
    I am on the {{ env:APP_ENV }} environment.
';

return Parse::template($template, $variables);

Here you have a simple single tag variable (favorite) that just spits out the string value, and a tag pair (brands) that loops over the array and replaces child keys with their appropriate values.

The above would output something like this:

My favorite food is bacon.
Here are some whiskey brands:
Lagavulin from Scotland
Jameson from Ireland
I am on the production environment.

But what happened with {{ env:APP_ENV }}? There’s no env value anywhere in the array.

Antlers didn’t find any env variable, so it looked outside the data to see if there is a Tag named env. It just so happened that there was, so it executed the code in that Tag method, reading APP_ENV from your .env file, and returning the found value, which happened to be production.

What variables get sent to your templates

The above is an example of a hardcoded set of variables, but what actually gets sent into your template?

So, if only that set of data is sent to your template, how would you get data from other places?

That’s where tags come in.

For instance, the Collection Tag will grab entries, and make their variables available to you within the tag pair. Now, if you didn’t notice, now the Collection Tag is basically doing what was explained above. The stuff between the tag pair is another mini-template, and the entry’s variables is the data array. How¬†meta!

The differences

Usage in conditionals

Tags require single braces inside conditions, variables do not.

Variable usage:

{{ if environment == "production" }}

Tag usage:

{{ if {env:APP_ENV} == "production" }}

Modifiers and parameters

Variables can have modifiers applied to them, tags cannot.

Tags can have parameters, variables cannot*.

Applying a modifier to a variable: OK!

food: bacon

{{ food | backspace:2 }}

bac

Applying a modifier to a tag: NO!

{{ some_tag | reverse }}
  • However, the “parameter syntax” modifiers may look like Tag parameters.

Applying a modifier to a variable using param syntax:

{{ food backspace="2" }}

bac

Applying a modifier to a tag using param syntax:

{{ some_tag backspace="2" }}

This would only do something if the tag is expecting a parameter named backspace. It will not apply the backspace modifier.

Last modified on June 13, 2017