Wie man eine Kindthema in WordPress erstellt und warum man sie überhaupt braucht

Hallo, Damen und Herren. Dieser Artikel wurde speziell für Sie vorbereitet. In diesem werde ich erklären, wie man eine WordPress-Kindthema erstellt. Es wird eine detaillierte Anleitung sein, in der ich alle Details erläutere. Ich füge auch ein Video bei, aber es wird bequemer sein, mit dem Textmaterial zu arbeiten, da Sie den gesamten Code einfach kopieren und leicht an Ihre Anforderungen anpassen können. Nun, lassen Sie uns mit der Erstellung des Kindthemas beginnen.

Kindthemen auf WordPress und wofür sie benötigt werden

Lassen Sie uns zuerst darüber sprechen, warum überhaupt Kindthemen benötigt werden. Die meisten WordPress-Benutzer wählen Themen aus dem offiziellen Repository. Dieser Ansatz hat ernsthafte Vorteile und einige Nachteile. Aber die Vorteile überwiegen bei weitem, sodass das Repository eine äußerst nützliche Sache ist.

Aber Themen aus dem Repository werden von Drittanbietern entwickelt, die den Code überwachen und die Themen aktualisieren.

Angenommen, Sie haben beschlossen, die Vorlage anzupassen und Änderungen vorgenommen. Sie haben auch Code für GA in der functions.php hinzugefügt. Alles funktioniert großartig! Aber zu einem bestimmten Zeitpunkt sehen Sie, dass ein Update für das Thema verfügbar ist.

Sie drücken auf die Schaltfläche “Themen aktualisieren”, warten und stellen plötzlich fest, dass die bearbeitete Vorlage verschwunden ist und alle benutzerdefinierten Codes aus der functions.php verschwunden sind.

Ja, genau so passiert es, das Update kann die manuell bearbeiteten Dateien durch aktualisierte Versionen ersetzen, die vom Autor des Themas erstellt wurden.

Dies kann auf zwei Arten vermieden werden:

1. Schlechter Weg – ein Fork des Themas erstellen. Das heißt, ein Thema nehmen, es vom Repository entkoppeln, aber dann liegt das Problem von Updates und der Aufrechterhaltung der Code-Aktualität bei Ihnen. Sie müssen sich gründlich mit dem Thema auseinandersetzen und es dann selbst pflegen. Im Allgemeinen ist es einfacher, ein Thema von Grund auf für sich selbst zu entwickeln.

2. Guter Weg – ein Kindthema erstellen.

Innerhalb des Kindthemas können Sie die Template-Dateien ändern und benutzerdefinierten Code hinzufügen, ohne befürchten zu müssen, dass Ihre Arbeit verloren geht. Lassen Sie mich das an einem einfachen Beispiel zeigen.

Angenommen, ich habe ein Thema installiert, es überprüft, aber mir gefällt der Link im Footer der Website überhaupt nicht, also habe ich beschlossen, ihn zu entfernen.

Wir finden den Code dieses Links in der footer.php-Datei.

Angenommen, ich habe den erforderlichen Code gefunden und den Link entfernt. Nach einem Monat habe ich das Thema aktualisiert. Und im Footer befindet sich wieder der altbekannte Link.

Okay, es ist nicht schwer, einen Link zu entfernen, aber wenn es viele Anpassungen gibt, werden Sie kämpfen müssen. Es ist besser, es von Anfang an richtig zu machen.

Dazu erstellen wir ein Kindthema und fügen den geänderten Template mit dem Code dort hinzu.

Jetzt wird das korrigierte Template eingebunden, der Link im Fußbereich der Website wird uns nicht mehr stören.

Alles ist korrigiert, alles funktioniert. Hauptsache, beachten Sie die Syntax.

Ebenso mit manuell hinzugefügten Funktionen. Was ist zu tun, wenn ich entschieden habe, das Favicon über functions.php einzubinden? Im Child Theme können Sie eine eigene functions.php hinzufügen, die im Gegensatz zu Templates die Datei der Hauptthema nicht vollständig ersetzt, sondern ergänzt.

Haben Sie beschlossen, eigene Styles zu erstellen? Großartig! Dafür haben wir die Datei style.css, in die Sie Ihre Anpassungen eintragen können, ohne Angst zu haben, sie bei Aktualisierungen zu verlieren.

Wie Sie sehen, sind Kindthemen notwendig, also zögern Sie nicht und erstellen Sie sie, wenn Sie vorhaben, das Thema dauerhaft zu verwenden und eigene Anpassungen vorzunehmen.

Wir erstellen ein Child Theme für WordPress

Nun, warum es wichtig ist, ein Child Theme zu erstellen, habe ich erklärt. Jetzt werde ich erklären, wie man es erstellt. In diesem Fall gibt es eine einfache Option – die Erstellung mit einem Plugin. Und eine etwas kompliziertere – die eigenständige Erstellung ohne Verwendung von Plugins. Beide Methoden werde ich im Detail beschreiben. Aber die zweite Methode empfehle ich nur, wenn die erste nicht funktioniert hat.

Child Theme mit Hilfe eines Plugins erstellen

Das ist der einfachste Weg. Dafür benötigen wir das Plugin “Child Theme Configurator”, das Sie aus dem WP-Repository installieren können: https://ru.wordpress.org/plugins/child-theme-configurator/. Gehen Sie dazu zum Admin-Bereich Ihrer Website → Bereich “Plugins” → “Neu hinzufügen”. Suchen Sie einfach nach dem benötigten Plugin.

Nach der Installation aktivieren Sie das Plugin. Gehen Sie nun zum Bereich “Werkzeuge” → “Child Themes”.

Nun haben wir mehrere Optionen:

1. CREATE a new Child Theme. Dies bedeutet, dass wir ein neues Child Theme erstellen werden, genau diese Option müssen Sie auswählen.

2. CONFIGURE an existing Child Theme. Es gibt einige Themen, die von Anfang an als Child Themes konzipiert sind. Zum Beispiel kann dies bei der Installation einer der VW-Themen der Fall sein. Diese Option ermöglicht es, ein fremdes Child Theme zu konfigurieren.

3. DUPLICATE an existing Child Theme. Erstellen Sie eine vollständige Kopie des Child Themes.

4. RESET an existing Child Theme (this will destroy any work you have done in the Configurator). Wird zum Zurücksetzen des Child Themes benötigt.

Also wählen Sie die erste Option, dann wählen Sie das Elternthema. Drücken Sie die Schaltfläche Analyze.

Nach der Analyse sollte eine Meldung erscheinen, dass dieses Thema ein Child Theme erstellen kann.

Wenn dies nicht der Fall ist, zum Beispiel, wenn bereits ein Child Theme für ein beliebtes Thema installiert ist, dann ist dieses Plugin nicht für Sie geeignet. Es ist besser, solche Themen überhaupt zu vermeiden, es gibt viele Probleme mit ihnen.

Und jetzt führen Sie die folgenden Aktionen aus:

1. Name the new theme directory. Geben Sie den Namen des Verzeichnisses für das Child Theme an. Am einfachsten ist es, den Namen des Themas + child zu verwenden. Verwenden Sie nur Kleinbuchstaben und ersetzen Sie Leerzeichen durch Bindestriche. Zum Beispiel my-theme-child.

2. Select where to save new styles. Wählen Sie hier standardmäßig Primary Stylesheet (style.css) aus. Das bedeutet, dass wir style.css style.css des Child Themes zum Schreiben der Styles verwenden werden. Wählen Sie eine andere Option nur dann, wenn Sie später alle CSS in einer separaten Datei zusammenführen möchten.

3. Select Parent Theme stylesheet handling. Wählen Sie Use the WordPress style queue aus. Das bedeutet, dass die Reihenfolge des Laden der Styles von WP bestimmt wird.

4. Customize the Child Theme Name, Description, Author, Version, etc. Geben Sie hier die Attribute des Child Themes in der Reihenfolge an: Themenname, Website des Themas, Autor, Website des Autors, Beschreibung, Tags, Version. Im Prinzip bin ich mit der automatischen Generierung zufrieden.

5. Copy Menus, Widgets and other Customizer Settings from the Parent Theme to the Child Theme. Wenn Sie bereits mit dem Elternthema gearbeitet haben, beispielsweise Menüs konfiguriert oder Widgets hinzugefügt haben, aktivieren Sie das Kontrollkästchen, damit die Einstellungen in das Child Theme kopiert werden.

6. Drücken Sie die Schaltfläche Create New Child Theme.

Das Theme ist erstellt, jetzt gehen Sie zu “Design” → “Themes” und aktivieren Sie es.

Erledigt, wenn Sie möchten, können Sie das Plugin ausschalten und die Arbeit ohne es fortsetzen, aber mit dem Child Theme können Sie auch über die Plugin-Schnittstelle arbeiten.

Ich bevorzuge es, Child Themes ohne Plugin zu erstellen, aber das ist eine Gewohnheit, und Sie müssen es nicht genauso machen.

Wenn aus irgendeinem Grund das Plugin das Child Theme nicht erstellen konnte, können Sie versuchen, dies ohne es zu tun. Aber wenn das Plugin diese Aufgabe nicht bewältigen konnte, ist es besser, das Thema zu wechseln, da das Problem wahrscheinlich genau darin liegt. Und auch bei manueller Erstellung werden Sie auf eine Reihe von Problemen stoßen.

Ich füge auch eine Videoanleitung hinzu.

Wir erstellen ein Kinderthema für WordPress ohne Plugins

Diesen Ansatz verwende ich am häufigsten, aber es ist eher eine Gewohnheit. Sie müssen jedoch viele Schritte ausführen. Es ist nicht schwierig, aber mühsam:

• Alles muss selbst gemacht werden, z. B. das Erstellen von Verzeichnissen.

• Syntaxfehler führen zur Inaktivität des “Child Themes”.

• Es wird länger dauern als die Installation des Plugins.

Lassen Sie uns nun zum Prozess übergehen. Das Erstellen eines “Child Themes” beginnt immer mit der Erstellung eines Verzeichnisses.. Создание дочерней темы всегда начинается с формирования каталога.

Der einfachste Weg: Erstellen Sie ein “Child Theme” auf Ihrem lokalen Computer, packen Sie es in ein Archiv und laden Sie dann dieses Archiv über die Benutzeroberfläche oder FTP auf das Hosting hoch.

Hier haben wir das Colibri WP-Theme. Der einfachste Weg:

1. Schauen Sie sich den Namen des Verzeichnisses des Elternthemas an und kopieren Sie ihn.

2. Erstellen Sie ein Verzeichnis, fügen Sie den kopierten Namen ein und fügen Sie “-child” hinzu.

3. Erledigt.

Jetzt müssen Sie eine neue Textdatei erstellen. Nennen Sie es style.css. Ändern Sie die Erweiterung von txt zu css. Wenn Sie die Erweiterung nicht sehen und Windows 10-11 haben, wechseln Sie zur Registerkarte “Ansicht” und aktivieren Sie die im Screenshot markierten Kontrollkästchen.

Jetzt können Sie die Datei öffnen und beginnen, sie zu bearbeiten. Am besten verwenden Sie den Editor Notepad++, ein ausgezeichnetes Werkzeug mit Syntaxhighlighting. Wenn Sie einen Fehler machen, weist Sie Notepad++ darauf hin. Laden Sie es herunter, es lohnt sich. Seien Sie nicht faul, laden Sie es herunter.

Und in der Datei style.css geben Sie einen solchen kommentierten Block ein:

/*
 Theme Name: Colibri WP Child
 Theme URL: https://workinnet.ru
 Description: Моя дочерняя тема
 Author: Puchlik Svirepiy
 Author URL: https://workinnet.ru
 Template: colibri-wp
 Version: 1.0.0
 Text Domain: colibri-wp-child
 */ 

Natürlich müssen Sie den Inhalt ändern, lassen Sie uns daher klären, was hier was ist.

1. Theme Name. Hier geben wir den Namen unseres “Child Themes” an. Sie können es nach Belieben benennen.

2. Theme URL. Jede URL ist praktisch die Adresse Ihrer Themenseite. Sie können Ihre Website angeben.

3. Description. Praktisch die Beschreibung des Themas, schreiben Sie, was Sie wollen.

4. Author. Der Name des Autors des Themas. Oder ein Spitzname.

5. Author URL. Die Website des Autors des Themas. Sie können Ihre Website angeben.

6. Template. Der Name Ihres Elternthemas. Geben Sie den Namen des Verzeichnisses an, in dem sich das Elternthema befindet. Geben Sie nicht den vollständigen Pfad zum Verzeichnis an, nur seinen Namen.

7. Version. Die Version des Themas. Sie können es ändern, um es mit Änderungen im Thema und gleichzeitig mit GIT. zu verfolgen. Es ist bequem.

Hier ist übrigens der Name des Verzeichnisses, den ich verwendet habe, um den Template-Parameter bei der Erstellung des “Child Themes” anzugeben.

Text Domain. Ich habe beschlossen, dies separat hervorzuheben, weil es ein wichtiger Parameter ist, der für die Lokalisierung verantwortlich ist. Angenommen, Sie haben ein Thema installiert, es in Ihre Sprache übersetzt und es dem “Child Theme” hinzugefügt.

Praktisch, wenn wir im Text Domain den Namen des “Child Themes” angeben, werden die Lokalisierungsdateien daraus priorisiert gegenüber denen im Verzeichnis des Elternthemas. Wenn Sie also vorhaben, das Thema selbst zu übersetzen, geben Sie unbedingt den Namen des “Child Themes” an.

Wenn Sie das Elternthema angeben, werden die Übersetzungsdateien daraus verwendet, und was sich im “Child Theme” befindet, wird von WordPress ignoriert.

Alles ist fast fertig. Im Prinzip benötigen Sie nur ein Verzeichnis mit der Datei style.css darin, alles andere ist optional. Verpacken Sie alles Aufgeführte unbedingt in einen Kommentar zwischen zwei dieser Dinge hier.

/*
сюды пихаем содержимое
*/

In CSS werden solche Kennzeichnungen benötigt, um zu kommentieren.

Aber lassen Sie uns es zu Ende bringen, damit alles in Ordnung ist. Im gleichen Verzeichnis, in dem Sie die Datei style.css platziert haben, erstellen Sie eine neue Datei und nennen Sie sie functions.php.

Öffnen Sie es mit Notepad++ und fügen Sie einen solchen Codeblock ein:

<?php
add_action('wp_enqueue_scripts', 'winnet_theme_styles' );
function winnet_theme_styles() {
	wp_enqueue_style('parent-theme-css', get_template_directory_uri() .'/style.css' );
	wp_enqueue_style('child-theme-css', get_stylesheet_directory_uri() .'/style.css', array('parent-theme-css') );
} 

Speichern Sie die Datei und schließen Sie sie. Dieser Code wird benötigt, um die Styles des Elternthemas zu laden.

Hervorragend, Sie haben gerade ein “Child Theme” ohne Plugin erstellt. Jetzt müssen Sie es nur noch auf das Hosting hochladen. Dazu packen Sie das Verzeichnis (genau das Verzeichnis!), in dem Sie die Dateien erstellt haben, in ein Archiv mit der Erweiterung .zip. Sie können auch eine andere Erweiterung verwenden, wenn Ihr Hosting dies unterstützt. Sie können dies mit WinRar tun. Sie können jedoch auch mit den integrierten Funktionen von Windows ein ZIP-Archiv erstellen.

Öffnen Sie nun den Dateimanager auf dem Hosting oder stellen Sie eine Verbindung über FTP her. Laden Sie dieses Archiv in den Ordner “Ihr-Website-Verzeichnis/wp-content/themes/” hoch und entpacken Sie es auf dem Hosting.

Hauptsache ist, dass der Ordner mit unserem “Child Theme” im Themes-Verzeichnis liegt.

Fertig, nur noch der letzte Schliff. Gehen Sie zum Admin-Bereich der Website → Abschnitt “Design” → “Themes”. Wählen Sie das “Child Theme” aus und klicken Sie auf die Schaltfläche “Aktivieren”. Überprüfen Sie die Funktionalität.

Hervorragend!

Wenn Sie das Thema nicht unter den anderen sehen, scrollen Sie etwas nach unten. Sie werden feststellen, dass das Thema als beschädigt markiert sein kann.

Dies hängt höchstwahrscheinlich mit dem falschen Namen zusammen, der in “Template” in der Datei style.css angegeben ist. Manchmal kann es vorkommen, dass das Elternthema die Erstellung eines “Child Themes” nicht zulässt. In diesem Fall ist es besser, das Thema zu wechseln.

Hier ist auch eine Videoanleitung beigefügt.

Viel Spaß bei der Arbeit!

Ich hoffe, ich konnte deutlich erklären, wie man ein “Child Theme” in WordPress erstellt. Glauben Sie mir, es ist besser, dies zu tun, es wird Ihnen die Arbeit erheblich erleichtern. Wenn etwas unklar ist, können Sie Fragen in den Kommentaren stellen, ich werde versuchen, schnell zu antworten.

Auf diesem Noten wünsche ich Ihnen viel Erfolg und effektiven Code!