---
title: "Drupal Templates: Wie ihr das Frontend kontrolliert"
lang: de
type: knowledge
canonical: https://www.arocom.de/wissen/drupal/templates
alternate: https://www.arocom.de/en/knowledge/drupal/templates
author: "Axel Roth"
last_updated: 2026-07-29
---

# Drupal Templates: Wie ihr das Frontend kontrolliert

Drupal Templates definieren, wie Inhalte im Frontend dargestellt
werden. Sie trennen Inhalt von Design und geben Frontend-Entwicklern
volle Kontrolle über das ausgegebene HTML. Drupal nutzt Twig als
Template-Engine, sicher, performant und leicht erlernbar. arocom
baut seit 2012 Custom Templates für Drupal-Projekte und setzt
auf sauberes, semantisches HTML, das Maschinen und Menschen
gleichermaßen bedient.

## Drupal Templates: Wie ihr das Frontend kontrolliert

Templates sind das Bindeglied zwischen euren Inhalten und dem,
was Nutzer sehen. In Drupal definieren Templates das HTML für
Seiten, Blöcke, Felder und jeden anderen Bestandteil eurer
Website. Die Trennung von Inhalt und Darstellung ist in Drupal
Architekturprinzip, und Templates sind der Mechanismus, der
diese Trennung umsetzt.

## Twig: Drupals Template-Engine seit Drupal 8

Seit Drupal 8 nutzt Drupal Twig als Template-Engine. Twig
ist sicher, weil es keinen PHP-Code in Templates erlaubt.
Das verhindert eine ganze Klasse von Sicherheitslücken, die
in älteren Drupal-Versionen möglich waren.

Twig ist lesbar. Die Syntax ist intuitiv und für
Frontend-Entwickler leicht erlernbar, auch ohne tiefe
PHP-Kenntnisse. Variablen, Schleifen und Bedingungen
decken die meisten Anwendungsfälle ab.

Twig ist performant. Templates werden in PHP kompiliert
und gecacht. Das Ergebnis: schnelle Seitenauslieferung
ohne Template-Overhead.

## Die Template-Hierarchie: Vom Allgemeinen zum Spezifischen

Drupal nutzt eine Template-Hierarchie mit Namenskonventionen.
Ihr könnt Templates auf jeder Ebene überschreiben:

**Seitenebene.** Das Grundgerüst der Seite: Header, Content-
Bereich, Sidebar, Footer.

**Node-Ebene.** Die Darstellung eines Inhaltstyps: Artikel,
Produkt, Veranstaltung. Für jeden Typ ein eigenes Template.

**Feldebene.** Die Darstellung einzelner Felder: Bild, Text,
Datum. Ihr kontrolliert das HTML bis auf Feldebene.

**Block-Ebene.** Wiederverwendbare Inhaltsblöcke wie
Navigation, Sidebar-Widgets oder Call-to-Action-Elemente.

Diese Hierarchie bedeutet: Ihr könnt das HTML eurer Website
präzise steuern, ohne den Drupal Core zu verändern. Das
macht Updates sicher und eure Anpassungen nachhaltig.

## Templates richtig einsetzen: Sauberes HTML für Menschen und Maschinen

Das Ziel ist nicht nur ein hübsches Design. Gute Templates
produzieren semantisches HTML, das barrierefrei ist und von
KI-Systemen verstanden wird.

**Semantische HTML-Elemente.** article, section, nav, aside
statt div-Suppen. Das hilft Screenreadern und KI-Systemen,
eure Inhalte zu verstehen.

**ARIA-Labels.** Barrierefreiheit beginnt im Template.
Drupal liefert ARIA-Attribute im Core, eure Templates
müssen sie beibehalten.

**Performance.** Weniger DOM-Elemente, weniger CSS-Klassen,
weniger Markup-Overhead. Saubere Templates sind schnelle
Templates.

arocom überprüft in jedem Projekt die Template-Qualität
auf Semantik, Barrierefreiheit und Performance. Das ist Teil
unseres Standard-Prozesses.

## Braucht eure Drupal-Website bessere Templates?

Der [Zukunfts-Check](https://www.arocom.de/zukunfts-check) prüft eure bestehende
Drupal-Installation auf Template-Qualität, Barrierefreiheit
und Performance. Unser Team meldet sich innerhalb von 4 Stunden
an Werktagen.

**Aus arocom-Projekten:**

- Beim [CJD](https://www.arocom.de/referenzen/cjd) (NGO mit ~11.000 Mitarbeitenden) haben wir die Plattform mit 21TORR relauncht und WCAG 2.1 AA durchgezogen. Der Drupal-9-Relaunch wurde bei den Splash Awards 2023 Zweiter in der Kategorie Social/Community, inzwischen läuft die Plattform auf Drupal 11.
- Bei COFAD war die Herausforderung nicht die Technik, sondern die Vernetzung: Berater, Projekte, Themen, alles miteinander verlinkt, alles durchsuchbar. Drupal 11 mit 20 maßgeschneiderten Modulen, Search-API-Index und Entity-Browser-Workflow macht das heute zum Tagesgeschäft.

### Brauche ich PHP-Kenntnisse für Drupal Templates?

Nein. Twig-Templates erfordern kein PHP. Die Twig-Syntax ist für Frontend-Entwickler mit HTML- und CSS-Erfahrung leicht erlernbar. Für komplexe Logik gibt es Preprocess-Funktionen in PHP, die Daten aufbereiten, bevor sie ans Template übergeben werden.

### Was ist der Unterschied zwischen Template und Theme?

Ein Theme ist die Gesamtheit aller Templates, CSS-Dateien und Assets, die das Erscheinungsbild einer Drupal-Website definieren. Templates sind einzelne Dateien innerhalb des Themes, die das HTML für bestimmte Elemente festlegen.

### Kann ich ein fertiges Theme anpassen?

Ja, über ein Subtheme. Ihr erbt die Funktionalität des Basis-Themes und überschreibt nur die Templates, die ihr ändern wollt. Das macht Updates des Basis-Themes sicher.

### Wie wirken sich Templates auf die Performance aus?

Saubere Templates mit wenig Markup-Overhead verbessern die Performance. Twig kompiliert Templates in PHP und cached sie. Aufwendige Template-Logik sollte in Preprocess-Funktionen verlagert werden.

## Weiterlesen

- [Drupal Theming](https://www.arocom.de/wissen/drupal/theming): Custom Design ohne Core-Hacks
- [Drupal Views](https://www.arocom.de/wissen/drupal/drupal-views): Daten flexibel anzeigen
- [Responsive Design 2026](https://www.arocom.de/wissen/drupal/responsive-webdesign): Mobile-First reicht nicht mehr
- [Zukunfts-Check (Audit)](https://www.arocom.de/zukunfts-check): Unabhängige Analyse eurer Installation