Konventionen für Twig-Template-Namen
Drupal lädt Templates basierend auf bestimmten Namenskonventionen. Dies ermöglicht es Ihnen, Templates zu überschreiben, indem Sie sie in Ihrem Theme hinzufügen und ihnen spezifische Namen geben.
Nachdem Sie ein Template hinzugefügt haben, müssen Sie den Cache leeren, damit Drupal Ihr neues Template erkennt.
Sie können Twig-Templates debuggen, um herauszufinden, welche Templates für die Ausgabe eines Elements verwendet werden. Mehr zum Twig-Debugging hier.
Diese Seite listet die Konventionen auf, die für die Grundstruktur von HTML, Seiten, Regionen, Blöcken, Nodes, Feldern und weiteren Hauptkomponenten verwendet werden. (Es ist nützlich zu wissen, dass Sie eigene Template-Vorschläge mittels der Funktion hook_theme_suggestions_HOOK_alter erstellen können.)
HTML (<head> Template)
Das HTML-Template stellt das Markup für die Grundstruktur einer HTML-Seite bereit, inklusive <head>, <title> und <body> Tags.
Basistemplate: html.html.twig (Basis-Pfad: core/modules/system/templates/html.html.twig)
Einige Beispiele, wie Sie das Basistemplate überschreiben können:
- html--[interner-View-Pfad].html.twig
- html--node--[nodeid].html.twig
- html.html.twig
Siehe API-Dokumentation zu html.html.twig.
Page Template
Template: page--[front|interner/pfad].html.twig
Basistemplate: page.html.twig (Basis-Pfad: core/modules/system/templates/page.html.twig)
Es gibt viele Vorschläge. Die Startseite hat Priorität. Der Rest basiert auf dem internen Pfad der aktuellen Seite. Die Startseite kann unter Administration > Konfiguration > System > Website-Informationen gewählt werden (Beispiel-Link). Das Template der Startseite heißt page--front.html.twig.
Verwechseln Sie den internen Pfad nicht mit Pfad-Aliasen, die nicht berücksichtigt werden.
Die Liste der Template-Vorschläge ist in der Reihenfolge der Spezifität basierend auf internen Pfaden angegeben. Für jeden Teil des aktuellen Pfads wird ein Vorschlag gemacht, wobei numerische Teile nicht auf nachfolgende Vorschläge übertragen werden. Zum Beispiel erzeugt „http://www.example.com/node/1/edit“ folgende Vorschläge:
- page--node--edit.html.twig
- page--node--1.html.twig
- page--node.html.twig
- page.html.twig
Siehe API-Dokumentation zu page.html.twig. Siehe auch Maintenance-Page-Template weiter unten.
Regions
Template: region--[region].html.twig
Basistemplate: region.html.twig (Basis-Pfad: core/modules/system/templates/region.html.twig)
Das Region-Template wird verwendet, wenn ein Bereich der Seite Inhalt hat, entweder aus dem Blocksystem oder aus Funktionen wie hook_page_top() oder hook_page_bottom(). Mögliche Regionsnamen werden in der Theme-.info.yml Datei definiert (Details).
Siehe API-Dokumentation zu region.html.twig.
Blocks
Template: block--[modulname]--[delta].html.twig
Basistemplate: block.html.twig (Basis-Pfad: core/modules/block/templates/block.html.twig)
- block--[modulname]--[delta].html.twig
- block--[modulname].html.twig
- block.html.twig
„modulname“ ist der Name des Moduls, und „delta“ ist die interne ID, die einem Block vom Modul zugewiesen wird.
Beispiel: „block--block--1.html.twig“ wird für den ersten vom Benutzer gesendeten Block verwendet, der über den Block-Admin-Bildschirm hinzugefügt wurde, da er vom Blockmodul mit der ID 1 erstellt wurde. Block-Templates, die regionspezifisch sind, sind in Drupal 8 nicht verfügbar.
Wenn Sie einen Block haben, der von einem benutzerdefinierten Modul namens „custom“ mit Delta „my-block“ erstellt wurde, heißt der Theme-Hook-Vorschlag „block--custom--my-block.html.twig“.
Ein weiteres Beispiel mit Views: Wenn Sie einen Block haben, der von Views mit dem View-Namen „front_news“ und der Display-ID „block_1“ erstellt wurde, lautet der Theme-Hook-Vorschlag: block--views-block--front-news-block-1.html.twig (beachten Sie, dass Unterstriche im Display-Id oder View-Namen durch Bindestriche ersetzt werden müssen).
Beachten Sie, dass Modulnamen in diesem Kontext case-sensitiv sind. Wenn Ihr Modul „MyModule“ heißt, ist der allgemeinste Theme-Vorschlag „block--MyModule.html.twig“.
Siehe API-Dokumentation zu block.html.twig.
Nodes
Template: node--[content-type|nodeid]--[viewmode].html.twig
Basistemplate: node.html.twig (Basis-Pfad: core/modules/node/templates/node.html.twig)
Theme-Hook-Vorschläge basieren auf folgenden Faktoren, geordnet von spezifischstem zu allgemeinstem Template. Drupal verwendet das spezifischste gefundene Template:
- node--[nodeid]--[viewmode].html.twig
- node--[nodeid].html.twig
- node--[content-type]--[viewmode].html.twig
- node--[content-type].html.twig
- node--[viewmode].html.twig
- node.html.twig
Beachten Sie, dass Unterstriche (_) im Content-Type-Maschinennamen durch Bindestriche (-) ersetzt werden.
Siehe API-Dokumentation zu node.html.twig.
Taxonomie-Begriffe
Template: taxonomy-term--[vocabulary-machine-name|tid].html.twig
Basistemplate: taxonomy-term.html.twig (Basis-Pfad: core/modules/taxonomy/templates/taxonomy-term.html.twig)
Theme-Hook-Vorschläge basieren auf folgenden Faktoren, geordnet von spezifischstem zu allgemeinstem Template. Drupal verwendet das spezifischste gefundene Template:
- taxonomy-term--[tid].html.twig
- taxonomy-term--[vocabulary-machine-name].html.twig
- taxonomy-term.html.twig
Beachten Sie, dass Unterstriche im Maschinen-Namen des Vokabulars durch Bindestriche ersetzt werden.
Siehe API-Dokumentation zu taxonomy-term.html.twig.
Felder
Template: field--[[type|name]|[entity-type]--[field-name|content-type]].html.twig
Basistemplate: field.html.twig (Basis-Pfad: core/modules/system/templates/field.html.twig)
Theme-Hook-Vorschläge basieren auf folgenden Faktoren, geordnet von spezifischstem zu allgemeinstem Template. Drupal verwendet das spezifischste gefundene Template:
- field--node--[field-name]--[content-type].html.twig
- field--node--[field-name].html.twig
- field--node--[content-type].html.twig
- field--[field-name].html.twig
- field--[field-type].html.twig
- field.html.twig
Beachten Sie, dass Unterstriche (_) im Feld-Maschinennamen durch Bindestriche (-) ersetzt werden. Vergessen Sie auch nicht, bei benutzerdefinierten Feldern „field-“ im Namen einzuschließen, z.B. field--field-phone.html.twig.
Siehe API-Dokumentation zu field.html.twig.
Kommentare
Template: comment--[comment-field-name]--[node-type].html.twig
Basistemplate: comment.html.twig (Basis-Pfad: core/modules/comment/templates/comment.html.twig)
Unterstützung wurde hinzugefügt, um Dateien comment--[comment-field-name]--[node-type].html.twig zu erstellen, damit Kommentare eines bestimmten Node-Typs anders formatiert werden können als andere Kommentare auf der Seite. Beispielsweise wird ein Kommentar zu einem Artikel-Node als „comment--field-comments--article.html.twig“ gerendert.
Siehe API-Dokumentation zu comment.html.twig.
Kommentar-Wrapper
Template: field--node--[comment-field-name]--[content-type].html.twig
Basistemplate: field--comment.html.twig
Foren
Template: forums--[[container|topic]--forumID].html.twig
Basistemplate: forums.html.twig (Basis-Pfad: core/modules/forum/templates/forums.html.twig)
Theme-Hook-Vorschläge basieren auf folgenden Faktoren, geordnet von spezifischstem zu allgemeinstem Template. Drupal verwendet das spezifischste gefundene Template:
Für Forum-Container:
- forums--containers--[forumid].html.twig
- forums--[forumid].html.twig
- forums--containers.html.twig
- forums.html.twig
Für Forum-Themen:
- forums--topics--[forumid].html.twig
- forums--[forumid].html.twig
- forums--topics.html.twig
- forums.html.twig
Siehe API-Dokumentation zu forums.html.twig.
Wartungsseite
Template: maintenance-page--[offline].html.twig
Basistemplate: maintenance-page.html.twig (Basis-Pfad: core/modules/system/templates/maintenance-page.html.twig)
Dies gilt, wenn die Datenbank nicht verfügbar ist. Nützlich, um eine freundliche Seite ohne Fehlermeldungen anzuzeigen. Das Maintenance-Page-Theme muss korrekt konfiguriert sein.
Siehe API-Dokumentation zu maintenance-page.html.twig.
Beachten Sie, dass die Datei maintenance-page--offline.html.twig derzeit nicht angezeigt wird, wenn die Datenbank nicht verfügbar ist. Issue #2720109: maintenance-page--offline.html.twig wird nicht gefunden, wenn System offline ist.
Suchergebnis
Template: search-result--[search-type].html.twig
Basistemplate: search-result.html.twig (Basis-Pfad: core/modules/search/templates/search-result.html.twig)
search-result.html.twig ist die Standardhülle für einzelne Suchergebnisse. Je nach Suchtyp gibt es unterschiedliche Vorschläge. Zum Beispiel führt „example.com/search/node/Search+Term“ zur Verwendung von „search-result--node.html.twig“. Im Vergleich dazu wird für „example.com/search/user/bob“ „search-result--user.html.twig“ verwendet. Module können Suchtypen erweitern und weitere Vorschläge hinzufügen.
Siehe API-Dokumentation zu search-result.html.twig.
Views
Alle Views-Templates können mit unterschiedlichen Namen überschrieben werden, indem View, View-Display-ID, View-Display-Typ oder eine Kombination daraus verwendet werden.
Für jede View werden mindestens zwei Templates verwendet. Das erste ist für alle Views: views-view.html.twig.
Das zweite Template wird durch den für die View gewählten Stil bestimmt. Bestimmte Aspekte der View können den Stil ändern, z. B. Argumente, die eine Zusammenfassung bieten, können spezielle Zusammenfassungsstile verwenden.
Der Standardstil für alle Views ist views-view-unformatted.html.twig.
Viele Stile rendern dann jede Zeile im Zeilenstil; der Standard-Zeilenstil ist views-view-fields.html.twig.
Templates:
- views-view--[viewid]--[view-display-id].html.twig
- views-view--[viewid]--[view-display-type].html.twig
- views-view--[view-display-type].html.twig
- views-view--[viewid].html.twig
- views-view.html.twig
Basistemplate: views-view.html.twig (Basis-Pfad: core/themes/stable/templates/views/views-view.html.twig)
Beispiel: Um das Template „views-view.html.twig“ für Ihre View zu überschreiben, sind folgende Template-Namen zulässig:
- views-view--[viewid]--[view-display-id].html.twig
- views-view--[viewid]--page.html.twig
- views-view--block.html.twig
- views-view--[viewid].html.twig
- views-view.html.twig
Templates basierend auf views-view-field.html.twig haben ein Suffix mit der Feld-ID der View (wie bei Template-Ersetzungen) für die Darstellung eines einzelnen Feldes:
- views-view-field--[viewid]--[view-display-id]--[fieldid].html.twig
- views-view-field--[viewid]--page--[fieldid].html.twig
- views-view-field--block--[fieldid].html.twig
- views-view-field--[fieldid].html.twig
- views-view-field.html.twig
Hier ein Beispiel für alle Templates, die im folgenden Fall getestet werden:
View mit Namen „foobar“. Stil: unformatiert. Zeilenstil: Felder. Anzeige: Seite.
- views-view--foobar--page.html.twig
- views-view--page.html.twig
- views-view--foobar.html.twig
- views-view.html.twig
- views-view-unformatted--foobar--page.html.twig
- views-view-unformatted--page.html.twig
- views-view-unformatted--foobar.html.twig
- views-view-unformatted.html.twig
- views-view-fields--foobar--page.html.twig
- views-view-fields--page.html.twig
- views-view-fields--foobar.html.twig
- views-view-fields.html.twig
Drupal’s online documentation is © 2000-2020 by the individual contributors and can be used in accordance with the Creative Commons License, Attribution-ShareAlike 2.0. PHP code is distributed under the GNU General Public License.