WordPress Template-Dateien im Child Theme überschreiben

Veröffentlicht am von / Lesezeit: 4 Minuten

Child Themes bieten verschiedene Möglichkeiten, mit denen du dein Parent Theme nach deinen Wünschen anpassen kannst. In diesem Tutorial zeige ich, wie du WordPress Template-Dateien im Child Theme überschreiben und modifizieren kannst.

WordPress Theme mit Child Theme anpassen

Mein allererster Beitrag hier im Blog war eine Schritt für Schritt Anleitung zur Erstellung eines Child Themes. Neben vielen Tutorials wie meinem gibt es auch einige Plugins, mit denen sehr einfach ein Child Theme erstellt werden kann.

Aber eigentlich ist die Erstellung des Child Themes erst der Anfang. Viel interessanter ist jedoch, welche Möglichkeiten es damit gibt, das Parent Theme zu modifizieren. Spontan fallen mir hier das Überschreiben von Templates und Pluggable Functions, das Hinzufügen von eigenen Funktionen und die Nutzung von Action und Filter Hooks ein.

Aus diesem Grund möchte ich aufbauend auf meinem ersten Tutorial eine kleine Serie über Child Themes starten. Zu Beginn sehen wir uns an, wie wir Template-Dateien mit einem Child Theme überschreiben können.

Was sind Template-Dateien?

Template-Dateien kontrollieren, wie deine Website im Frontend dargestellt wird. Die Templates bestehen aus HTML-Code oder generieren HTML-Code durch entsprechende Template-Funktionen oder den WordPress Loop.

Ein Theme hat meistens mehrere, unterschiedliche Template-Dateien. Jedes Template hat eine bestimmte Aufgabe. Manche Dateien wie die Templates für Header und Footer werden auf jeder Seite verwendet, andere kommen nur unter bestimmten Bedingungen zum Einsatz.

Wichtige Template-Dateien sind:

  • header.php (stellt den Header des Themes dar)
  • footer.php (stellt den Footer des Themes dar)
  • home.php (zeigt den Blog Index mit den letzten Beiträgen)
  • single.php (zeigt einen einzelnen Blog Beitrag)
  • page.php (zeigt eine statische Seite an)
  • sidebar.php (Darstellung der Sidebar Widgets)

Einige Templates werden von WordPress anhand der URL direkt aufgerufen. Verweist der Permalink beispielsweise auf einen Blog Beitrag, Archiv oder statische Seite, wird dafür jeweils die single.php, archive.php und page.php aufgerufen.

Andere Template-Dateien werden innerhalb von anderen Templates geladen. Die header.php und footer.php werden nicht vom WordPress Core aufgerufen, sondern in den anderen Dateien mithilfe von get_header() und get_footer() eingebunden.

Eine ausführliche Übersicht über alle verfügbaren Template-Dateien und Erklärung der Template-Hierarchie findest du in in einem weiteren Beitrag von mir:

Die verschiedenen Template Dateien in einem WordPress Theme

Warum du Template-Dateien nur mit einem Child Theme ändern solltest

Ein Überschreiben von Template-Dateien ist immer dann sinnvoll, wenn du den HTML-Code für einen bestimmten Bereich in deinem Theme anpassen möchtest. Durch das Ersetzen der Template-Datei mit einem eigenen Template im Child Theme kannst du Modifikationen vornehmen, ohne dass die Template-Datei im Parent Theme verändert wird.

Das hat den Vorteil, dass deine Änderungen bei Theme Updates nicht verloren gehen.

Bei einem Update löscht WordPress nämlich alle Theme-Dateien, entpackt dann die .zip-Datei des Updates und installiert das Theme quasi neu. Alle Dateien des Themes werden so restlos ersetzt; jede Änderung der Templates ist damit verloren.

Dein Child Theme hingegen ist vom Update des Parent Themes nicht betroffen.

WordPress Template-Dateien im Child Theme überschreiben

Alle Template-Dateien können mit einem Child Theme überschrieben werden, egal, um welche Art es sich handelt.

Zum Überschreiben einer Template-Datei des Parent Themes muss eine Datei mit dem gleichen Namen im Child Theme angelegt werden. Das bedeutet, dass du die originale Template-Datei vom Parent Theme einfach kopieren und im Child Theme einfügen kannst.

Beispiel:

Du möchtest eine Änderung für statische Seiten vornehmen. Du kopierst deshalb die page.php vom Parent Theme und fügst sie im Child Theme ein, sodass du folgende Dateistruktur erhältst:

  • /wp-content
    • /themes
      • /parent-theme
        • page.php
      • /child-theme
        • page.php

Anschließend wird automatisch die page.php des Child Themes geladen.

Das liegt daran, dass WordPress mit aktiviertem Child Theme immer zuerst nachsieht, ob es das angeforderte Template vom Child Theme laden kann. Erst wenn die Template-Datei dort nicht vorhanden ist, läd WordPress das Template vom Parent Theme.

Befindet sich die Template-Datei in einem Unterordner, musst du einen gleichnamigen Ordner auch in deinem Child Theme erstellen. Wichtig ist, dass der komplette Pfad zur Template-Datei im Child Theme genau gleich ist.

Beispiel:

Es soll die content-single.php von TwentySixteen in einem Child Theme angepasst werden.

  • /themes
    • /twenty-sixteen
      •  /template-parts
        • content-single.php
    • /my-twenty-sixteen-child
      •  /template-parts
        • content-single.php

Unterschied zwischen Template- und Funktions-Dateien

Nicht alle PHP-Dateien im WordPress Theme sind Templates.

Neben Template-Dateien existieren auch noch Funktions-Dateien. Im Grunde hat ein WordPress Theme mit der functions.php eigentlich nur eine einzige Datei für Funktionen. Da es aber sehr unübersichtlich wäre, alle Funktionen in eine Datei zu packen, laden viele Themes von der functions.php aus noch weitere PHP-Dateien für Funktionen.

/* Custom template tags for this theme */
require get_parent_theme_file_path( '/inc/template-tags.php' );

/* Additional features to allow styling of the templates */
require get_parent_theme_file_path( '/inc/template-functions.php' );

/* Customizer additions */
require get_parent_theme_file_path( '/inc/customizer.php' );

Wie viele andere Themes hat z.B. auch TwentySeventeen einen eigenen Ordner /inc für weitere Funktions-Dateien. Dort lässt sich beispielsweise eine customizer.php für Theme Optionen oder template-tags.php für Template-Funktionen finden.

Im Gegensatz zu Template-Dateien sind diese funktionellen Dateien nicht direkt für die Darstellung eines bestimmten Bereichs im Theme zuständig, sondern beinhalten nur eine Reihe von Funktionen und Klassen. Manche Funktionen können durchaus auch HTML ausgeben, die ganze Datei ist aber kein Template.

Wichtig zu wissen:
Diese funktionellen PHP-Dateien können NICHT im Child Theme überschrieben werden.

Alle Beiträge der Serie über Child Themes