Child Theme erstellen

Child Themes sind ein wichtiges Konzept in WordPress, das Du kennen solltest, wenn Du Deine Website erweitern bzw. einfach das Layout und Funktionalitäten anpassen willst.

Was ist ein WordPress Child Theme und wofür brauchst Du eines?

Wie der Name schon sagt kann man sich ein Child Theme als „Kind“ eines übergeordnetem „Eltern“-Themes vorstellen. Dabei „erbt“ das Child Theme die Eigenschaften der Vorlage, kann einzelne Teilbereiche wie Layout und Stile, also HTML und CSS Eigenschaften überschreiben.

Der Vorteil liegt auf der Hand: Du nutzt ein Theme, das zum Großteil deinen Vorstellungen entspricht, und passt eben nur gezielt Einzelbereiche an deine Vorstellungen an.

Child Theme oder Zusätzliches CSS?

Wenn Du nur ein paar CSS-Änderungen vornehmen willst, dann brauchst Du nicht zwingend ein Child Theme zu erstellen. Du kannst auch im Customizer > Zusätzliches CSS direkt die CSS-Styles eingeben, die du ändern oder hinzufügen möchtest.

Sollte die Option Zusätzliches CSS im Customizer nicht aufzufinden sein, dann wird dies wahrscheinlich von Deinem Theme nicht unterstützt.

Bei umfangreicheren Änderungen am Stylesheet kann der CSS Code im Customizer recht schnell unübersichtlich werden.

Spätestens wenn du PHP-Snippets hinzufügen möchtest oder Template Dateien (auch .php) ersetzen willst, kommst du um ein Child Theme eigentlich nicht mehr herum.

Child Theme selbst erstellen

1. Child Theme Ordner erstellen

Logge dich per FTP, etwa mit FileZilla auf deinen Server ein und erstelle im WordPress-Ordner unter wp-content/themes einen neuen Ordner mit dem gewünschten Namen deines Child Themes.

Oft wird als Name elterntheme-child verwendet, du kannst den Ordner aber nach deinem Belieben auch ganz anders nennen.

2. style.css erstellen

Als nächstes erstellst du die style.css Datei. Du kannst mit jedem Texteditor eine einfache Textdatei erstellen und die Endung auf .css ändern.

Den Theme Name kannst du nach Belieben wählen.

Wichtig ist der Eintrag Template. Hier gibst du den Ordnernamen des Elternthemes an.

Trage hier deine gewünschten Daten ein, sie werden in der style.css unten angepasst:

Kopiere jetzt folgenden Code in deine neu erstellte style.css Datei.

/*
 Theme Name: Dein Theme Name
 Template: elterntheme_ordnername
*/

Es gibt noch diverse andere Daten, die du dort eintragen kannst, wie z. B. eine Description, den Autor des Themes etc.. Erforderlich für ein funktionierendes Child Theme sind aber nur „Theme Name“ und „Template“. Falls Dich die anderen Einstellungen interessieren, kannst du sie hier finden: Child Theme Optionen.

In älteren Anleitungen liest man manchmal noch, dass man einen Code in der Art @import url("../parenttheme/style.css"); in die style.css eintragen soll. Diese Vorgehensweise ist veraltet und wird auch von WordPress offiziell nicht mehr empfohlen.

Wenn Du die Datei fertig bearbeitet hast, lade sie per FTP in deinen vorher erstellten Childtheme Ordner hoch.

Falls Du Dich wunderst, warum diese Informationen in einer CSS-Datei stehen … das ist bei WordPress eben so geregelt, dass die Informationen über das Child Theme aus den Kommentaren der style.css ausgelesen werden. Logisch ist es nicht unbedingt ;).

3. functions.php erstellen

Nun musst du noch die Datei functions.php mit dem Texteditor Deiner Wahl erstellen. Dort kopierst Du folgenden Code hinein.

<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
 
    $parent_style = 'parent-style'; 
 
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}

Mit diesem Code sagen wir WordPress, dass es sowohl die style.css des Elternthemes wie auch die style.css unseres Child Themes laden soll.

Auch diese Datei lädst Du per FTP in deinen Childtheme-Ordner.

Geschafft! Jetzt solltest Du dein erstelltes Child Theme im WordPress Adminbereich unter Design > Themes finden und aktivieren können.

Child Theme per Plugin erstellen

WordPress wäre nicht WordPress, wenn es für das Erstellen eines Child Themes nicht auch eine Lösung per Plugin gäbe. Tatsächlich gibt es sogar mehrere Plugins zur Auswahl.

Ich empfehle das Plugin Child Theme Generator. Es ist nach meiner Erfahrung das am einfachsten zu bedienende Plugin zur Erstellung eines Child Themes.

  1. Klicke im Admin-Menü auf Einstellungen > Child-Theme Gen
  2. Wähle das gewünschte Eltern-Theme unter Parent Theme
  3. Klicke auf Create new child theme

Jetzt sollte das Child Theme erstellt sein und Du musst es nur noch unter Design > Themes aktivieren

Falls Du mit dem Child Theme Generator nicht zum gewünschten Ergebnis kommst, kannst Du das noch umfangreichere Plugin Child Theme Configurator ausprobieren. Hier hast Du noch mehr Einstellungsmöglichkeiten, die den Anfänger aber eher überfordern.

Schreibe einen Kommentar