Bevor wir lernen, wie wir ein Child Theme erstellen, müssen wir zunächst wissen, was ein Child Theme ist und warum es wichtig sein kann.
Ein WordPress Child Theme ist sozusagen das Kind des Elternthemes. Wenn wir in WordPress ein Theme anpassen, können wir es anschließend nur schwer auf die neueste Version aktualisieren, ohne die vorgenommenen Änderungen zu verlieren.
Wenn wir Änderungen an unserem aktuellen Theme vornehmen, benötigen wir also ein Child Theme. Mit diesem können wir unser übergeordnetes Theme aktualisieren, ohne Änderungen zu verlieren.
Erstellen eines Child Themes
Schritt 1
Das Erstellen eines Child Themes ist nicht komplizierter als die Arbeit, die Sie bereits mit einem einzelnen Haupttheme ausgeführt haben.
Sie erstellen ein Verzeichnis für das Child Theme im vorhandenen Verzeichnis wp-content / themes. Es ist am besten, eine gute Verzeichnisorganisation beizubehalten, indem Sie -child am Ende des Namens des übergeordneten Themes einfügen. Sie können auch den Namen des spezifischen Projekts hinzufügen, wenn Sie dies vorziehen. Denken Sie daran, keine Leerzeichen in den Dateinamen aufzunehmen, da dies zu Fehlern führen kann. Zum Erstellen eines neuen Verzeichnisses können Sie entweder den FTP-Client oder den Dateimanager verwenden.
Im folgenden Beispiel wird mit dem Dateimanager ein Child Theme basierend auf dem Theme „Twenty Sixteen“ erstellt. Der vollständige Pfad zum Ordner „Child Theme“ lautet also wp-content / themes / twentyseventeen-child.
Navigieren Sie zu Ihrem WordPress-Installationsverzeichnis (normalerweise public_html) und öffnen Sie den Ordner wp-content > themes.
Klicken Sie auf das Symbol zum Erstellen eines neuen Ordners, geben Sie den Namen Ihres untergeordneten Themas ein und klicken Sie auf „Erstellen“.
Schritt 2
Greifen Sie auf den Ordner des neu erstellten Child Themes zu.
Klicken Sie auf die Schaltfläche Neue Datei, geben Sie style.css als Dateinamen ein und klicken Sie auf Erstellen.
Füllen Sie die Datei mit dem folgenden Code, den Sie natürlich noch für Ihre Domain anpassen müssen:
/*
Theme Name: Twenty Sixteen Child
Theme URL: [URL Ihrer Webseite]
Description: Twenty Sixteen Child Theme
Author: John Doe
Author URL: [URL Ihrer Webseite]
Template: twentysixteen
Version: 1.0.0
Text Domain: twentysixteen-child
*/
Schritt 3
Geben Sie Ihrem neuen Theme einen Namen und ändern Sie alle anderen Werte entsprechend Ihrem Theme- und Domainnamen. Das wichtigste Feld ist das Templatefeld, da es WordPress mitteilt, auf welchem übergeordneten Theme Ihr Child Theme basiert.
Schritt 4
Fügen Sie eine neue functions.php-Datei im selben Ordner hinzu, kopieren Sie den Code jedoch nicht aus der Datei des übergeordneten Designs, da er von allen Änderungen, die Sie am untergeordneten Design vornehmen, getrennt bleiben muss. Erstellen Sie stattdessen eine leere Datei oder fügen Sie neue .php-Funktionen hinzu, die für Ihr untergeordnetes Theme erforderlich sind.
Schritt 5
Navigieren Sie im WordPress-Administrationsbereich zu Darstellung -> Designs, um das neu erstellte Design anzuzeigen, und klicken Sie auf Aktivieren.
Schritt 6
Navigieren Sie im WordPress-Administrationsbereich zu Darstellung -> Editor und wählen Sie functions.php.
Kopieren Sie den folgenden Code, passen Sie ihn für Ihre URL und Ihr Child Theme an und fügen Sie ihn in die function.php-Datei des untergeordneten Themes ein:
/*
Theme Name: Twenty Sixteen Child
Theme URL: [Ihre URL]
Description: Twenty Sixteen Child Theme
Author: [Ihr Name]
Author URL: [Ihre URL]
Template: twentysixteen
Version: 1.0.0
Text Domain: twentysixteen-child
*/
Klicken Sie unten auf der Seite auf Aktualisieren, um Ihre Änderungen zu speichern.
Besuchen Sie Ihre Website erneut. Sie werden feststellen, dass das CSS geladen ist und Ihr untergeordnetes Design genau so aussieht wie das übergeordnete Design.
Wie Sie sehen können, ist die Erstellung eines WordPress-Child-Themes ziemlich einfach, wenn Sie den Vorgang in einzelne Schritte aufteilen.
Contents