Template engines

WordPress and template engines

Out of the box, WordPress does not include any template engine integration. Most experienced developers manually integrate their preferred template engine while developing a custom WordPress theme.

However, because WordPress does not have native Composer support, fully safe integration is challenging, as some plugins may also include a template engine. This can lead to conflicts due to re-definition. In practice, this means that after manually integrating a template engine, developers must carefully choose and test the plugins they will use.

Meanwhile, the Advanced Views Framework offers built-in and safe integration for both Twig and Blade, allowing you to use them on any website without worrying about conflicts. To achieve this, we used a scoping tool and a bit of technical wizardry. You can read more about how we achieved this here.

Benefits and Why we use engines instead of PHP templates

For many developers coming from the old-school WordPress theme templates approach, the advantages of using any template engine may not be immediately apparent.

First and foremost, it's important to understand that both Twig and Blade are built on top of PHP, so it's essentially a PHP tool. When comparing the engines and PHP directly, it may seem that the engines have fewer capabilities than PHP. However, this is actually one of its strengths. Using any engine for templates is often better than the native PHP approach because it:

a) Enforces separation of Logic and Presentation

One of the most significant issues with classic PHP templates in WordPress is the tendency to mix logic and presentation within the same template file. If you examine templates in many traditional WP themes, you'll find that they contain not only presentation markup but also direct data retrieval and processing. This results in spaghetti code that is prone to bugs and challenging to maintain.

Template engine was specifically designed for generating presentation templates. It confines you to the task of output generation and prevents you from mixing it with other tasks like data retrieval and processing.

c) Includes automatic auto-escaping

In WordPress, developers are required to manually escape variables when generating markup to prevent cross-site scripting (XSS) vulnerabilities. With the template engine, you don't need to worry about escaping variables anymore. The template engine automatically escapes all variables passed into the template by default.

If you have a specific case where you want to pass HTML content without escaping, you can do so by using the |raw filter in Twig, or {!! !!} brackets in Blade, making it easy to handle both escaped and unescaped content safely.

Using engine's automatic auto-escaping feature can help improve the security of your templates by reducing the risk of XSS attacks and making your code more maintainable.

b) Generates more clear and readable code

Even when using PHP templates exclusively for output generation, employing a template engine like Twig is still a preferred choice because it results in cleaner code. To illustrate, consider the examples below:

In PHP:

<?php foreach ($items as $item) { ?>
<div class="item">
    <p class="name"><?php echo esc_html($item['name']); ?></p>
    <p class="surname"><?php echo esc_html($item['surname']); ?></p>
    <a class="link" href="<?php echo esc_url($item['link_url']); ?>"><?php echo esc_html($item['link_title']); ?></a>
</div>
<?php } ?>

In Twig:

{% for item in items %}
<div class="item">
    <p class="name">{{ item.name }}</p>
    <p class="surname">{{ item.surname }}</p>
    <a class="link" href="{{ item.link_url }}">{{ item.link_title }}</a>
</div>
{% endfor %}

Even in this small example, it's evident that Twig leads to more readable code. Once you become accustomed to Twig, looking at real-life PHP templates with numerous variable injections will make PHP's verbosity, which necessitates opening and closing tags and using 'echo' repeatedly, seem cumbersome.

Note: We are aware of the short PHP echo syntax. While it's somewhat better than the PHP example above, it's still less elegant than Twig or Blade. Additionally, the use of the short echo syntax is discouraged in plugins and themes by the WordPress codex and may produce fatal PHP errors on some hosting environments if the specific php.ini setting is disabled.

d) Wide usage

Wide usage is a bonus that can motivate you to learn Twig or Blade if you're unfamiliar with them yet.

Twig is used in many well-known software, like Symphony framework, Drupal and October CMS. And even though it isn't employed in WordPress out-of-the-box, it's used in 105+ WordPress plugins.

Meanwhile, Blade is Laravel's templating engine, and thanks to its syntax, it's very friendly to any experienced PHP developers.

So you can level up your skills by learning any of these amazing template systems.

Twig vs Blade comparison

If you're new to template engines, below we provide an overview of the key features to help you choose the best one for your project.

Feature	Twig	Blade
Minimum PHP version	7.4 (as WordPress)	8.2.0
Shortcuts for if, for and echo statements	yes	yes
Auto-escaped output	yes	yes
Support of custom PHP functions	partials (functions and filters must be registered in Twig)	full (any PHP function can be called out-of-the-box)
Built-in set of helper functions	yes	no (native PHP should be used)

How to switch

AVF is a framework built using a modular approach, which means that each View or Card is independent and has its own 'Template Engine' field.

This allows you to use one View with Twig while another uses Blade. However, in practice, this is mostly useful for testing purposes, and you will likely use one engine for all Views and Cards.

While Twig engine is the default option when you create new Views and Cards, you can change it to Blade in the Defaults tab of the plugin settings. After that, Blade will be used as the default engine for all new Views and Cards.