Aanmaken van custom Twig-sjablonen voor een custom module

Het algemene idee in Drupal 8 is dat je wilt vermijden om HTML direct in de PHP-code van je custom module te schrijven. Je wilt dit laten verlopen via Twig-sjablonen. Om nieuwe Twig-sjablonen in je module aan te maken, volg je deze stappen:

Stap 1: Definieer hook_theme in het .module-bestand
Maak een [module].module-bestand aan als dit nog niet bestaat en voeg de code toe die elk van je Twig-sjablonen definieert. De sleutel van elk element in de array is wat je later nodig hebt om het sjabloon aan te roepen. Gebruik geen koppeltekens in de bestandsnaam.

function test_twig_theme($existing, $type, $theme, $path) {
  return [
    'my_template' => [
      'variables' => ['test_var' => NULL],
    ],
  ];
}

Zie de documentatie van hook_theme().

Stap 2: Roep het sjabloon aan
Op de plaats waar je je render-array teruggeeft (bijvoorbeeld vanuit een controller-methode die wordt aangeroepen vanuit het yml-bestand van je router, of ergens anders), roep je het Twig-sjabloon aan. Hieronder een voorbeeld van een testmodule die wordt aangeroepen vanuit een routing-yml-bestand in de module (extra uitleg over dit deel kan nodig zijn).

/**
 * @file
 * Contains \Drupal\test_twig\Controller\TestTwigController.
 */
 
namespace Drupal\test_twig\Controller;
 
use Drupal\Core\Controller\ControllerBase;
 
class TestTwigController extends ControllerBase {
  public function content() {
 
    return [
      '#theme' => 'my_template',
      '#test_var' => $this->t('Test Value'),
    ];
 
  }
}

Je kunt ook de render-service gebruiken om output te genereren, als je dit nodig hebt als onderdeel van een ander proces in je code:

$renderable = [
  '#theme' => 'my_template',
  '#test_var' => 'test variable',
];
$rendered = \Drupal::service('renderer')->renderPlain($renderable);

Houd er rekening mee dat dit een basisimplementatie is die geen caching uitvoert. De Render API Overview bevat meer informatie over hoe je caching kunt toevoegen. Over caching gesproken: de namen van variabelen worden gecachet. Als je ze wijzigt (bijvoorbeeld van «test_var» naar «my_var»), moet je de cache legen.

Stap 3: Maak het Twig-sjabloon
Maak in je module, in de map templates, een Twig-sjabloon aan. De bestandsnaam moet overeenkomen met wat je in hook_theme() hebt gezet (vervang underscores door koppeltekens). In dit geval is de bestandsnaam my-template.html.twig.
Hier is het bestand dat ik gebruikte om te testen:

<p>Test twig template!</p>
 
<p>test_var: {{ test_var }}</p>

Het mooie hiervan is dat het sjabloonbestand dat in je module is gedefinieerd, wordt gebruikt als er nog geen bestand in je thema aanwezig is. Plaats je bestand gewoon in de templates-map van je thema, wis de cache (drush cache-rebuild), en Drupal zal dit bestand inlezen.

Je kunt het bestand in elke submap van de themamap plaatsen om alles georganiseerd te houden.