The first minor release of Blockstudio 3 has finally arrived. And oh boy, is it packed with goodies. In fact, there are so many crucial new features here that we consider this release to be the real 3.0 release. Let's dive right in!

Timber

Blockstudio gives you complete freedom in terms of templating. You can use PHP, Twig or both on a block basis. Timber, the unofficial official Twig integration for WordPress is now included with Blockstudio. Before, you had to install Timber as a plugin or with composer to make use of Twig. Since Timber already removed official support, when installed as a plugin, this update comes in handy when wanting to use Blockstudio with Twig as a templating language on simpler sites.

Environment variables

A highly requested feature has finally landed in Blockstudio: environment variables. These variables can be used inside block templates to check if the block is being rendered in the editor or in the block inserter preview.

• $isEditor - checks if block is being rendered inside the editor
• $isPreview - checks if blocks are being rendered inside the block preview

These variables are a powerful tool to create notices for your users in case some attributes are empty (like images) or to provide general information when the block is inserted in a "clean" state.

Icon field type

Icons are an integral part in web design and are able to make websites more accessible for visitors with language barriers. Blockstudio now includes an icon field type which enables a native way to render icons in your blocks. Over 25.000 icons from the best open-source icon libraries are included: Bootstrap Icons, Box Icons, CSS.GG, Feather Icons, Flat Color Icons, Fontawesome Free, Grommet Icons, Heroicons, Ion Icons, Material Design Icons, Octicons, Remix Icons, Simple Icons, Table Icons and VSCode Icons.

Worried about performance? Blockstudio is not making use of icon fonts, but instead directly renders the SVG of the selected icon.

SVG icons

WordPress doesn't allow for custom SVG icons inside its own block.json icon key, only Dashicons IDs are allowed here. The new update adds a way to do exactly that:

            {
      "blockstudio": {
        "icon": "<svg></svg>"
      }
    }

      
Copy

Field conditions

Conditionally displaying fields inside the editor depending on global conditions like user id or post type was already possible prior to 3.1. Now it is also possible to conditionally display fields depending on the value of other fields.

            {
      "blockstudio": {
        "attributes": [
          {
            "type": "toggle",
            "id": "copyButton",
            "label": "Copy Button"
          },
          {
            "type": "text",
            "id": "copyButtonText",
            "label": "Copy Button Text",
            "default": "Copy",
            "conditions": [
              [
                {
                  "id": "copyButton",
                  "operator": "==",
                  "value": true
                }
              ]
            ]
          }
        ]
      }
    }

      
Copy

And that's a wrap! Next on the roadmap are some other highly requested features like repeater and WYSIWYG fields, inner blocks, and various other minor enhancements.