Differences Between Twig and Branch Code

As of March 2017, Branch Code is deprecated and no longer developed. Use the Twig syntax instead.

While syntax is the largest difference between Twig and Branch Code there are some other differences. Below are some that you may notice in Twig templates.

App Code Snippets

The tag to include code snippets into a content template is different from other API tags. That is because the code needs to be injected into the content template and then rendered as though it was originally part of that content template. The new format for the code snippet tag is:  {% include "app-snippet/blog/tag-detail" %}.

Due to how app code snippets are included in the page, Inline CSS, CSS Files, Inline Javascript, Javascript Files and Head Content data is not used with the code snippet. Only the Template code is.

Comparing values

You have to use "==" to do comparisons in Twig. "=" is only for setting values.

Images

With Twig you can manipulate image tag attributes before outputting the image tag.

Forms

With Twig you can manipulate form field tag attributes and form tag attributes before outputting them.

In Twig form templates {{ field.name }} will return the name value for the field while {{ field.name.attr }} will return the full attribute (name="field-name").

The opening form tag in Twig is {{ form.openTag }} and the closing form tag is {{ form.closeTag }} .

There isn't a form.tag array. If you need to manually build out the form tag you can access the attribute values on the {{ form }} array like this
<form method="{{ form.method }}" action="{{ form.action }}">.

Form Templates

You should create your form templates under Forms -> Form Templates. When a site is running fully on Twig the form-specific templates are no longer supported.

Looping through API values

You can loop through the results of an API call without having to first save the API to a variable.

{% for post in _api.blog.recentPosts.limit(2) %}
    <p>POST: {{ post.postTitle }}</p>
{% endfor %} 

Setting variables

With Twig there is a lot more functionality around setting variables. 

You can set a variable with an API call. This will set the 2 most recent blog posts to the data variable.

{% set data = _api.blog.recentPosts.limit(2).raw() %}

If you're incrementing a value you can do something like this:

{% set count = 1 %}
{% set count = count + 1 %}

Filters / Variable Modifiers

Variable modifiers are now called filters. Most Branch Code variable modifiers have a Twig equivalent, but there are some differences.

Filters no longer need the "output", "save" or "saveAs" parameters. You can use filters when setting data, looping through values or to output a value. Because they can be used in multiple ways it's the use that determines if the filtered value is outputted. 

For example, you can use a filter when assigning a value.

{% set value = name|upper %}

Or save the value back to the original variable.

{% set name = name|upper %}

Or use the filter to output the result.

{{ name|upper }}

json filter

The json filter does the same thing but it no longer accepts the "key" parameter and thus no longer outputs everything under the "data" value.

Templates

  • Site templates and snippets now support all the full logic that content templates support.
  • Templates no longer support the Inline CSS, CSS Files, Inline Javascript, Javascript Files or Head Content content. Instead, you should use the Page Object to set that content.

Containers

  • The Navigation, Snippet and Content Area content types are no longer supported. Use the API or Custom Content types instead.