So erstellen Sie ein WordPress-Child-Theme

Veröffentlicht: 2020-04-16

Sind Sie bereit, ein Child-Theme in WordPress zu erstellen?

Inhalt
1 Parent-Theme-Installation
2 So erstellen Sie ein untergeordnetes WordPress-Theme-Verzeichnis
3 Erstellen Sie ein Stylesheet
4 Erstellen Sie die Funktionsdatei
5 Der Mechanismus zum Erstellen eines Child Themes in WordPress
6 Vorschläge für Ersteller von Kinderthemen
7 Dateien im Child-Theme
8 So aktivieren Sie das Child-Theme
9 So erstellen und passen Sie ein untergeordnetes WordPress-Theme an
10 Untergeordnete und übergeordnete Themenfehler beheben
11 Dinge, an die Sie sich für WordPress Child Themes erinnern sollten

Parent-Theme-Installation

Sie müssen entscheiden, welches Thema Sie bevorzugen. Abhängig von Ihren Vorlieben sollten Sie das Thema auswählen, das Sie als übergeordnetes Thema auswählen möchten.

So erstellen Sie ein untergeordnetes WordPress-Theme-Verzeichnis

Erstellen Sie eine neue Datei im Ordner public_html/wp-content/themes der WordPress-Installation, um das Design zu speichern. Vermeiden Sie dies auf einer Live-Site. Sie können dies auf einer Entwicklungssite testen, bevor Sie es auf einer Staging-Site implementieren. Normalerweise ist es eine gute Praxis, den neuen Ordnernamen beizubehalten, der mit einem übergeordneten Designnamen gefolgt von einem Suffix beginnt.

Dieser Prozess beinhaltet die Erstellung von zwei Dateien: Stylesheet und Funktionsdatei.

Erstellen Sie ein Stylesheet

Erstellen Sie eine neue Datei
style.css
in den Ordner und fügen Sie den folgenden Code hinzu:
 /*

Designname: Untergeordnetes CodeFlist-Design

Theme-URI: https://yourwebsite.com/codeflist-child/

Beschreibung: Untergeordnetes Design des übergeordneten CodeFlist-Designs

Autor: Amar Raj Mahato

Autoren-URI: https://demo.codeflist.com/

Vorlage: CodeFlist

Version: 1.0.0

Tags: schwarz, grün, weiß, hell, dunkel, zweispaltig, dreispaltig, linke Seitenleiste, rechte Seitenleiste, festes Layout, responsives Layout, benutzerdefinierter Hintergrund, benutzerdefinierte Kopfzeile, benutzerdefiniertes Menü, Editor- Stil, Featured-Images, Flexible-Header, Full-Breite-Template, Mikroformate, Post-Formate, RTL-Sprachunterstützung, Sticky-Post, Theme-Optionen, Übersetzungsbereit, Zugänglichkeitsbereit, Responsive-Layout, Endlos- scroll, post-slider, design, food, journal, magazine, news, photography, portfolio, sauber, zeitgenössisch, dunkel, elegant, modern, professionell, anspruchsvoll

Textdomäne: codeflist-child

*/

Dieser Code teilt WordPress das Thema mit. Da der Text auskommentiert ist, führt er nichts auf Ihrer Website aus. Jedes Theme hat diese Datei, um sich mit WordPress vertraut zu machen.

Die Zeilen mit Designname und Vorlage können in diesem Code nicht übersprungen werden. Die Vorlage sollte den Verzeichnisnamen des übergeordneten Designs enthalten. Es wird normalerweise auch zwischen Groß- und Kleinschreibung unterschieden. Alle anderen Felder sollten wie erforderlich geschrieben werden. Stellen Sie sicher, dass Sie dies mit Ihrem bevorzugten Editor richtig machen.

Erstellen Sie die Funktionsdatei

Das Hinzufügen der Funktionsdatei ist ein notwendiger Schritt, um das Stylesheet aus dem übergeordneten Design einzureihen. Wenn Sie diesen Schritt verpassen, hätte Ihr untergeordnetes Thema überhaupt kein Styling. Fügen Sie außerdem eine Datei hinzu
Funktionen.php
im neuen Ordner. Fügen Sie den folgenden Code hinzu:
 <?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
Funktion my_theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
?>

Der Mechanismus zum Erstellen eines Child Themes in WordPress

Sie arbeiten auf Dateiebene. Wenn eine Funktion die Datei aufruft, prüft sie, ob sie vorhanden ist oder nicht. Falls die Datei im untergeordneten Design fehlt, wird sie aus dem übergeordneten Design geladen. Es gibt jedoch eine Ausnahme in Form der Funktionsdatei des Themas. Wenn die
Funktionen.php
Datei aufgerufen wird, wird sie von beiden Orten geladen. Ihre Website wird nicht funktionieren, wenn die Funktion des übergeordneten Designs nicht funktioniert. Wenn der gesamte Inhalt der Funktionsdatei des übergeordneten Designs in das untergeordnete Design kopiert wird, wäre dies eine Lösung. Dies ist kein guter Ansatz, um das Thema zu erweitern. Wenn die Fußzeilendatei geändert werden soll, muss die Fußzeilendatei vom Elternteil auf das Kind kopiert werden. Verarbeiten Sie dann die Dateien und speichern Sie die Änderungen. Dies gilt für alle Abschnitte, die Sie ändern möchten.

Vorschläge für Ersteller von untergeordneten Themen

Sie müssen den Unterschied zwischen kennen
get_stylesheet_directory()
und
get_template_directory()
wenn Sie Ihre eigenen Themen erstellen. Ihnen muss klar sein, dass die
get_template_-Funktion
wird immer auf das Verzeichnis des übergeordneten Themas verweisen und
get_stylesheet_ Punkte
das Verzeichnis des Child-Themes. Sie haben die Wahl, ob Sie das Elternteil oder das Kind verwenden möchten.

Dateien im Child-Theme

Es gibt mindestens zwei Dateien, ein Stylesheet und eine Funktionsdatei. Das Stylesheet teilt WordPress die Art des Themes mit. Es gibt auch eine Vorstellung über das übergeordnete Thema. Alle Details werden mithilfe des auskommentierten Textformats in das Stylesheet aufgenommen.

Es ist eine falsche Praxis, ein Stylesheet von einem anderen Stylesheet aufzurufen. Tatsächlich sollten Sie die Funktionsdatei in die Warteschlange einreihen. Es sollte eine Funktion in der Funktionsdatei geben, die das Stylesheet einreiht.

Das Parent-Theme enthält eine
index.php
Datei, wird aber im Child Theme nicht benötigt.

So aktivieren Sie das Child-Theme

WordPress verwendet eine Datei aus dem übergeordneten Design, es sei denn, Sie überschreiben es, indem Sie Dateien zum untergeordneten Design hinzufügen. Gehe zu
Aussehen > Themen
, finden Sie das Design unter den installierten Designs auf Ihrer Website. Sie müssen es aktivieren, um seine Funktionen nutzen zu können. Wenn Sie keine Anpassungen hinzugefügt haben, sieht es genauso aus.

So erstellen und passen Sie ein untergeordnetes WordPress-Theme an

Wenn Sie jetzt ein funktionierendes Design haben, können Sie Anpassungen gemäß Ihren gewünschten Anforderungen hinzufügen. Wenn Sie Stylesheets bearbeiten möchten, können Sie Regeln in der definieren
style.css
im Child-Theme-Ordner. Sie können nicht nur Vorlagendateien bearbeiten, sondern auch das übergeordnete Thema aktualisieren, ohne dass Anpassungen verloren gehen. Das Schreiben von Funktionen kann jedoch komplexer sein als das Hinzufügen von Vorlagendateien. Wenn Sie eine neue Funktion hinzufügen möchten, müssen Sie zu gehen
Funktionen.php
Datei. Sobald Sie die Funktion geschrieben haben, fügen Sie die relevante Aktion oder den Filter hinzu, um die zusätzliche Funktionalität hinzuzufügen.

Grundsätzlich gibt es drei Methoden, wenn Sie die Parent-Theme-Funktion überschreiben möchten.

  • Wenn Sie ein austauschbares übergeordnetes Thema haben, können Sie eine andere Funktion mit demselben Namen in das untergeordnete Thema schreiben. Die Funktion im Parent Theme wird dadurch übersprungen.
  • Wenn Sie ein unpluggable Parent Theme haben, kann ein Unhooking durchgeführt werden, um zu verhindern, dass eine Funktion vom Parent Theme ausgeführt wird.
  • Es gibt Fälle, in denen Sie eine neue Funktion hinzufügen können, um sie an denselben Hook, aber mit einem anderen Namen, anzuhängen. Dies geschieht, ohne eine Funktion zu überschreiben oder zu entfernen.

Beheben Sie Fehler bei untergeordneten und übergeordneten Themen

Nach der Erstellung eines Child-Themes kann es aufgrund einiger Funktionen, Stile oder anderer Dateien zu Problemen kommen. Es gibt eine Reihe von Schritten, um sicherzustellen, dass alles korrekt ist.

  1. Überprüfen Sie, ob das untergeordnete Thema aktiviert wurde oder nicht. Sie müssen sich über den Status eines übergeordneten Themas im Klaren sein.
  2. Löschen Sie den Browser-Cache und den von den Plugins erstellten Cache.
  3. Überprüfen Sie, ob Sie die Dateien korrekt mit korrekter Syntax benannt haben, wenn Sie ein untergeordnetes Thema in WordPress erstellen.
  4. Überprüfen Sie, ob Sie die Änderungen gespeichert haben oder nicht.
  5. Wenn die Pluggable-Funktion nicht funktioniert, überprüfen Sie, ob ein Namenskonflikt vorliegt oder ob die Funktion im Parent-Theme Pluggable ist oder nicht.
  6. Überprüfen Sie die in der Funktion vorhandenen Prioritätswerte und Hooks im Falle von überschreibenden Problemen.
  7. Überprüfen Sie den Prioritätswert, den Namen und den Hook, wenn das Problem von der entfernten Funktion generiert wird.
  8. Finde heraus, wo und wo ein Fehler im Code ist, indem du die Datei wp-config.php im Debug-Modus überprüfst.
  9. Der Ausgabecode für verschiedene Elemente muss überprüft werden.

Dinge, an die Sie sich für WordPress Child Theme erinnern sollten

  1. Es sollte ein Stylesheet und eine Funktionsdatei in einem Child-Theme geben.
  2. Bearbeite Themes von Drittanbietern nicht direkt, ohne ein Child-Theme zu erstellen. Dadurch werden die vorgenommenen Anpassungen geschützt.
  3. Aktivieren Sie das Design und löschen Sie das übergeordnete Design nicht.
  4. Wenn es zwei Dateien mit demselben Namen gibt, verwendet WordPress die Datei in der untergeordneten Datei.
  5. Um eine Plug-in-Funktion im Parent-Theme zu überschreiben, musst du die gleichnamige Funktion im Child-Theme anlegen.
  6. Mit der Verwendung der Funktionen remove_action() oder remove_filter() können Sie eine Funktion vom übergeordneten Design lösen.
  7. Wenn Sie eine Funktion mit demselben Hook erstellen, können Sie eine Parent-Theme-Funktion erweitern.

Einpacken

Diese Dinge sollten Sie beachten, um ein Child-Theme in WordPress zu erstellen, Sie können den maximalen Vorteil daraus ziehen. Hoffentlich klärt dieser Artikel Ihre Zweifel am Child- und Parent-Theme.

Zusätzliche Lesungen

WordPress Holen Sie sich die Beitrags-ID
Beiträge vs. Seiten in WordPress
Was ist ein WordPress-Child-Theme
So löschen Sie Themes in WordPress
So fügen Sie eine Kategorie in WordPress hinzu
So ändern Sie das Passwort in WordPress