Twig

Since version 1.4.0, Blockstudio also supports Twig templates. Please note that Timber is needed for templates written with Twig.

Registration

Same as PHP, all block registration data is being taken from the file header. Please be aware that Twig templates don't support the $register or $settings variable at this stage.

{# Title: My Block Description: Some description Category: content #} <p>My Markup</p>

Fields and previews

Similar to PHP, custom fields and examples can be defined in their respectively named variable. Let's create the CTA example from before with Twig:

{# Title: Call to Action Description: Call to action element. Category: blockstudio Icon: lightbulb Mode: preview #} {# acf #} {% set fields = [ { "key" : "cta_title_key", "label": "Title", "name" : "cta_title", "type" : "text" }, { "key" : "cta_subtitle_key", "label": "Subtitle", "name" : "cta_subtitle", "type" : "text" } ] %} {# metabox #} {% set fields = [ { "id" : "cta_title", "label": "Title", "type" : "text" }, { "id" : "cta_subtitle", "label": "Subtitle", "type" : "text" } ] %} {# acf #} {% set example = { "attributes": { "mode" : "preview", "data" : { "cta_title_key": "This is the title", "cta_subtitle_key": "This is the subtitle" } } } %} {# metabox #} {% set example = { "cta_title": "This is the title", "cta_subtitle": "This is the subtitle" } %} <h1>{{ field.cta_title }} </h1> <h2>{{ field.cta_subtitle }} </h2>

Parameters

All PHP parameters are also available in your Twig templates:

{# Title: Call to Action Description: Call to action element. Category: blockstudio Icon: lightbulb #} The available aligns are {{ block.align }} {% if is_preview %} Only show this in the block editor. {% endif %} The current post id is: {{ post_id }}