Child Theme WordPress
Sei es ein neuer Text im Footer oder nur die neue Schrift für die Navigation-Bar – Bevor man wichtige Änderungen an seinem WordPress-Theme vornimmt, sollte man immer ein Child-Theme erstellen! Das Elegant Themes-Team hat bei ihrer letzten Umfrage festgestellt, dass zwar 85% ihrer Kunden den Theme-Code modifizieren, aber nur 35% ein Child Theme erstellen. Außerdem werden bei jedem Theme-Update deine Änderungen am Original gelöscht. Du findest im Folgenden eine schriftliche Anleitung und am Ende des Beitrags noch einen Screencast zu Child Themes.

Warum man Child Themes nutzen sollte

Eines sei von vornherein gesagt: Wenn man Child Themes benutzt, erspart man sich wirklich sehr viel Arbeit im Nachhinein. Denn hat man einmal eine funktionierende Website mit einigen Lesern, sollte man sich diesen Erfolg nicht durch ein zerschossenes Theme kaputt machen. Mit dem Child Theme kannst du wirklich auch jedes kleinste Detail deiner Website modifizieren ohne die ursprünglichen Einstellungen zu verlieren. Es wird ein komplett neue Verzeichnisstruktur erstellt, sodass du einfach über die WordPress-Oberfläche zu deinem alten Theme wechseln kannst.

Los gehts

Ich werde dieses Tutorial anhand des Divi Themes von Elegant Themes erklären. Die Schritte lassen sich so aber auf jedes Theme übertragen.

    1. Für dein neues Child Theme erstellst du zunächst lokal auf deinem Computer einen Ordner, z.B. mit dem Namen divi_child_theme.
    2. Erstelle eine style.css Datei in dem Child Theme-Ordner mit folgendem Inhalt:
      </code>
      /*
      Theme Name: Child Theme
      Theme URI: http://www.theme_url.de
      Description: Child Theme
      Author: Hans Otto
      Author URI: http://www.hansotto.de
      Template: Theme
      Version: 1.0.0
      */
      @import url("../Theme/style.css");
      /* =Theme customization starts here
      ------------------------------------------------------- */
      <code>
    3. Wichtig sind Template und @import: Template muss exakt dem Namen deines Parent Themes entsprechen. über @import sollte auch der genaue Dateipfad auf deinem Server zur style.css-Datei deines Parent Themes angegeben sein.
    4. Wenn alles korrekt eingetragen wurde, muss man den divi_child_theme-Ordner nur noch zippen (das geht unter Windows direkt mit dem Datei-Explorer und unter Mac mit dem Finder) und bei WordPress hochladen. Dies wird wie bei jedem anderen Theme über Design – Themes – Hinzufügen – Theme hochladen gemacht.

Child Theme WordPress

CSS bearbeiten

Mit dem Child Theme sollte deine Webseite genauso wie vorher aussehen. Nun kannst du hinter dem @import-Befehl dein Costum-CSS einfügen. Zunächst lädt WordPress die alte CSS-Datei. Alle neuen Befehle überschreiben automatisch die Alten.

Functions.php bearbeiten

Durch erstellen einer neuen functions.php-Datei im Child Theme-Ordner fügt man der bestehenden PHP-Datei im Parent Theme Funktionen hinzu. Also wird die Originaldatei nicht ersetzt,wie bei der style.css! Ähnlich verfährt man auch, wenn man beispielsweise den footer-Bereich seiner Website über die footer.php-Datei verändern möchte. Hier ist aber Vorsicht geboten: Wenn eine neue  footer.php-Datei erstellt wird, wird die alte ganz überschrieben! Also sollte man vorher immer ein Backup der alten Datei anlegen.

Alles klar soweit? Sonst schau doch mal hier vorbei:

  1. Die Anleitung bei Elegant Themes: Wie immer einfach und intuitiv erklärt. Außerdem mit angeschlossenem Kommentaren, die oft sehr nützlich sind!
  2. WordPress Codex: Eine ausführliche Anleitung direkt von WordPress
  3. One klick Child Theme: Das Plugin erzeugt automatisch ein Child Theme. Habe ich noch nicht ausprobiert, ich bevorzuge den manuellen Weg.