Ein Blog über Code, Hardware und Co

Wordpress und Webentwicklung, Programmieren und Entwickeln

WordPress Child Theme erstellen – 3 Möglichkeiten

Zuletzt aktualisiert am 14. Dezember 2020.

Theme-Updates müssen häufig durchgeführt werden. Allerdings können individuelle Anpassungen dabei verloren gehen. Wenn Du Dein benutzerdefiniertes Template sicher auf den neusten Stand bringen möchtest, kann es hilfreich sein, ein Child-Template zu verwenden. Damit bist Du bei einem Update vor Überraschungen sicher. Was ein Child-Theme ist und wie Du es anlegst, erfährst Du in diesem Artikel.

Durch ein Child-Theme können eigene Änderungen an einem Theme optimal mit Wartbarkeit und Updates durch den Entwickler des Themes verbunden werden.

Teil1: Was sind Child-Themes in WordPress?

Viele WordPress Nutzer kennen das Problem, dass Änderungen am Template updatesicher vorgenommen werden müssen. Anpassungen wie Veränderungen an der style.css, an der footer.php oder an einer anderen Datei werden mit einem WordPress Child-Template garantiert nicht überschrieben.

Bei einem Child-Theme handelt es sich um eine Design-Vorlage, welche die Funktionalität und das Design eines vorhandenen Templates übernimmt.
Bei der Arbeit tauchen viele verwirrende Begriffe auf, die jedoch bei näherer Betrachtung einfach zu verstehen sind. Das vorhandene Theme wird als Parent-Template oder Eltern-Theme bezeichnet. Das Child-Template ist das Kind, das die Eigenschaften des Parent-Themes erbt. Durch Kind-Design-Vorlagen kannst Du das bestehende WordPress-Theme ohne Probleme ändern.

Übersicht Child-Theme Begriffe

BegriffSynonymErläuterung
Parent-ThemeEltern-ThemeQuasi die Vorlage oder Blaupause. Sämtliche Informationen wie Styleinformationen (css) oder auch PHP-Code wird aus dem Parenttheme gewonnen. Das Elterntheme wird weiterhin wie gewohnt geupdatet.
Child-ThemeKind-ThemeDas Kind-Theme ist das Theme, welches WordPress primär verwenden soll und wird. Hier kannst Du Änderungen vornehmen. Das Kind-Theme erbt direkt alle Eigenschaften vom Elterntheme.
Tabelle 1: Erläuterung von Begriffen im Zusammenhang mit WordPress-Child-Themes.

Teil2: Warum Du ein Child-Theme brauchst

Du erreichst durch die Erstellung eines Child-Themes, dass Du mehr Freiraum in der Entwicklung und Anpassung des Themes erhältst. Du kannst Veränderungen an Deinem Template vornehmen, ohne an die Eltern-Vorlage herangehen zu müssen. Dadurch kannst Du zu jeder Zeit ohne Probleme Updates für Deine hauptsächliche Design-Vorlage erstellen. Deine individuellen Anpassungen am Theme bleiben stets erhalten.

Vorteile eines Child-Themes für Anfänger

Falls Du noch Anfänger bist und Dir diesen Schritt nicht zutraust, solltest Du überlegen, dass die Erstellung eines Child-Themes gerade für Einsteiger gut geeignet ist. Sollte bei Deinen Anpassungen etwas schieflaufen, musst Du lediglich das Child-Theme neu zu erstellen. Das Parent-Template bleibt unberührt

Viele Nutzer fragen sich, wie sinnvoll ein Child-Theme ist. Zu Beginn sieht die Arbeit aufwendig aus. Doch die Erstellung eines Kind-Templates ist die sauberste Lösung bei updatesicheren Anpassungen am Eltern-Theme.

Teil 3: Ein Child-Theme erstellen: So gehts!

Jetzt geht es ans Eingemachte. Von der Theorie in die Praxis. Ich zeige dir die 3 gängigsten Möglichkeiten ein Child-Theme zu erstellen.

Bei der Frage, wie am besten vorzugehen ist, stehen Dir drei Möglichkeiten zur Auswahl zur Verfügung. Du kannst entweder ein Plug-in zu Hilfe nehmen, einen Webservice nutzen oder selber ein WordPress Child-Theme herstellen.

Methode1: Mithilfe eines Plug-ins

Diese Variante ist in der Regel die einfachste. Plugin installieren, Theme auswählen, fertig.

Für WordPress stehen derzeit einige Plug-ins zur Verfügung, mit deren Hilfe Du ein Child-Theme erstellen kannst. Eines davon ist der Child Theme Configurator. Mit diesem Plug-in lässt sich ein Kind-Template einfach erstellen. Die Handhabung ist einfach und das Plug-in ist intuitiv bedienbar.

Mit dem Child Theme Configurator kannst Du ein untergeordnetes Thema erstellen und nach Belieben anpassen. Der Child Theme Configurator wurde für WordPress-Benutzer entwickelt, die ihre Stylesheets für untergeordnete Designs direkt anpassen möchten. Alle CSS-Attribute, die Du ändern möchtest, kannst Du leicht identifizieren und überschreiben.

Der Analyzer scannt das gerenderte Thema. Außerdem konfiguriert er Dein untergeordnetes Theme automatisch. Dir wird damit jeder erdenklicher Komfort geboten. Zusätzlich läuft die Kind-Theme-Erstellung in klaren Schritten ab.

Auch einzelne Files aus dem Elterntheme können hier (auch nachträglich) dem Childtheme hinzugefügt werden.

VorteileNachteile
Einfache Child-Theme-Erstellung für AnfängerBlackbox, der Algorithmus des Plugins erstellt das Theme
Erklärung der einzelnen SchritteUnter Umständen wird das Child-Theme auf einem fremden Server (Onlineservice) generiert
Kein Entwicklungsaufwand
Kostenlos
Tabelle 2: Vor- und Nachteile der Erstellung eines WordPress Child-Themes mittels eines Plugins.

Methode2: Mithilfe eines Webservice

Falls Du das Kind Template ohne ein Plugin, aber auch ohne Code-Bearbeitung anlegen möchtest, kannst Du einen Webservice nutzen. Dazu musst Du lediglich einige Daten wie den Name Deines Eltern-Templates und dergleichen in ein Formular eingeben und danach auf einen Button zu klicken. Sofort wird Dir Dein Child-Theme als ZIP-File zur Verfügung gestellt. Den entpackten Ordner musst Du lediglich in den Theme-Ordner Deiner WordPress-Installation hochladen.

Der Upload-Pfad sollte ungefähr so aussehen: /wp-content/themes/Dein-child-theme/.

Tipp: Alternativ kannst Du das Child-Theme in der Regel auch einfach über die WordPress-Admin-Oberfläche hochladen und installieren.

Oft machen Plugins übrigens nicht viel anderes, als das ausgewählte Theme ebenfalls zu einem Webservice hochzuladen und dort zu konvertieren.

Mögliche Webservices sind z.B.:

  • Lorem ipsum
VorteileNachteile
Einfacher geht es nichtBlackbox, was genau der Webserver bei der Erstellung des Child-Themes macht, ist nicht ersichtlich.
Direkt ein Install-Package für das Child-ThemeAchtung: Potentiell unsicher, der Webservice könnte unerwünschten Code einbauen. Daher NUR vertrauenswürdige und etablierte Services nutzen.
Kostenlos
Keine Plugin-Installation notwendig
Tabelle 3: Vor- und Nachteile der Erstellung eines Childthemes über einen Webservice.

Methode3: Manuelle Erstellung

Die manuelle Erstellung des Child-Themes ist denkbar einfach, man kann jedoch bei Fehlern schnell einiges kaputt machen.
Diese Methode ist daher eher für Personen gedacht, die schon einmal die eine oder andere .css- oder .php-Datei gesehen haben 😉
Du benötigst lediglich drei Dateien: Die style.css, die functions.php und die screenshot.png. Die Dateien erstellst du optimalerweise lokal und lädst sie dann über FTP auf deinen Server.

a) style.css anlegen

Die style.css besteht lediglich aus ein paar Zeilen. Das zeigt das untenstehende Beispiel anhand des Antreas Parent Templates:

/*
Theme Name: Antreas-child
Description: Mein Child Theme
Author: Autor Name
Author URI: http://www.Antreas.de
Template: Antreas
Version: 1.0.0
Text Domain: Antreas-child
*/

b) functions.php erstellen

Im Anschluss musst Du noch die Datei functions.php herstellen. Dort steht, dass zuerst das Eltern-Theme und dann das Child-Template geladen wird.

functions.php:

<?php
/**
* Das Child Theme wird nun eingebunden bzw. die Sources werden geladen.
*/

function child_theme_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-theme-css', get_stylesheet_directory_uri() .'/style.css' , array('parent-style'));

}
add_action( 'wp_enqueue_scripts', 'child_theme_styles' );?>

c) Screenshot erstellen (optional)

Zum Schluss kannst Du noch eine Bilddatei als ‘screenshot.png’ anlegen. Die Bilddatei wird Dir in Deiner WordPress-Installation als Child-Template angezeigt. Der Screenshot-Part ist sogar optional 😉

Teil4: WordPress Child-Theme einrichten

Lade alle erstellten Dateien per FTP auf Deinem Server hoch. Dazu kannst Du beispielsweise ein FTP-Programm wie FileZilla verwenden.

Lege im Ordner Themes Deiner WordPress Installation einen neuen Ordner für das Child-Theme an. Diesen benennst Du am besten mit dem Template-Namen und dem Zusatz ‘Child’. Somit erkennt das Programm, dass es sich um das Child-Template des entsprechenden Haupt-Themes handelt.

Sodann kannst Du schon das Child-Theme aktivieren. Klicke im Dashboard Deiner WordPress-Installation unter ‘Design’ auf ‘Themes’. Dort kannst Du Dein Kind-Template aktivieren. Es wird neben Deinem Parent-Theme aktiv. Solltest Du eine Fehlermeldung erhalten, liegt das häufig an einem Fehler in der Datei ‘style.css’ im Child-Template.

Nun kannst Du alle Design-Anpassungen direkt in der Datei style.css Deines Child-Templates vornehmen. Nimm alle Änderungen vor und lade Deine Seite neu. Sogleich sollten Deine individuelle Styles sichtbar sein.

Schluss: Fazit

Du kannst bei der Verwendung eines WordPress Child-Themes einige Vorzüge erhalten. Durch Child-Template lassen sich gefahrlos Anpassungen am Style oder an der Funktion eines Templates vornehmen. Das Eltern-Template bleibt von den Änderungen unberührt. Solltest Du Dich bei Deinen Angleichungen verschreiben, kann fast nichts schiefgehen.

Dein Parent-Theme bleibt in jedem Fall bei Fehlern innerhalb des Child-Templates erhalten. Allerdings müsstest Du bei einem Fehler die Child-Vorlage umschreiben, ändern oder neu installieren. Deine individuellen Änderungen bleiben selbst von einem Update Deiner Design-Vorlage unberührt.

Schreibe eine Antwort