Using Twig templates in your theme

Drupal’s theming layer uses the Twig templating system, a component from the Symfony project. Twig is a template language that uses a syntax similar to Django and Jinja templates.

In this recipe, we will override the default Twig template used for text inputs to provide customizations for the email form element. We will use the Twig syntax to add a new class to the input element and provide a placeholder attribute.

Getting ready

This recipe uses a theme created by the theme generator as done in the Creating a custom theme to style your Drupal site recipe.

How to do it…

1. To begin, in the template/form directory, copy the input.html.twig file as input--email.html.twig. The template will look like the following:

   {#

   /**

    * @file

    * Theme override for an 'input' #type form element.

    *

    * Available variables:

    * - attributes: A list of HTML attributes for the

       input element.

    * - children: Optional...