Kontakt
Kontakt

Aktualisiert am

Ein Child-Theme in WordPress anlegen

SEO und WordPress Freelancer Hans-Jürgen Herbst

Hi, ich bin Hans-Jürgen – WordPress Freelancer und SEO-Experte. Ich baue jeden Tag Webseiten und arbeite grundsätzliche mit Child-Themes.

Ein Child-Theme ermöglicht es dir, Anpassungen an deinem Theme vorzunehmen und Funktionen durch eigenes JavaScript zu erweitern ohne das Original-Theme (auch Parent-Theme genannt) zu verändern. Ohne Child-Theme würden Änderungen bei Updates verloren gehen. Das Child-Theme erbt alle Funktionen, Stile und Vorlagen des Parent-Themes. Die Anleitung ist für Block-Themes geschrieben – ausdrücklicklich nicht für Pagebuilder wie Elementor.

So erzeugst du ein Child-Theme

1. Plugin installieren

Installiere das Standard-Plugin Create Block Theme von wordpress.org

Create Block Theme

2. Theme erzeugen

Navigiere im Menü zu Design > Block-Theme erstellen

Wähle aus der Liste „Geschwister-Theme von XYZ erstellen“ und trage einen beliebigen Namen für dein Theme ein. Die weiteren Felder sind optional.

Sobald du auf „Erstellen“ klickst, wird ein .zip heruntergeladen.

3. Theme hochladen und aktivieren

Navigiere zu Design > Themes > Neues Theme hinzufügen > Theme hochladen

Lade das gerade erzeuge .zip hoch und aktiviere das Theme. Fertig.

Nutzung der functions.php

Die functions.php-Datei in einem Child-Theme ist ein mächtiges Werkzeug, das dir erlaubt, das Verhalten deines WordPress-Themes zu ändern oder zu erweitern. Hier sind einige Dinge, die du tun kannst:

  1. Eigene Skripte und Stylesheets hinzufügen (z.B. für visuelle Effekte)
  2. Gesperrte Funktionen freischalten (z.B. den Upload von SVG-Daten erlauben)
  3. Bestehende Funktionen anpassen (z.B. Das verhalten der Suchfunktion ändern)

Nicht jedes Block-Theme enthält per default eine functions.php. Du kannst dafür einfach eine leere Datei in das root-Verzeichnis deines Child-Themes ablegen.

Verbinde dich dafür via SFTP (zum Beispiel mit Filezilla) mit deinem Webspace, um die Datei hinzuzufügen.

Custom JavaScript und CSS

Umfangreiche Erweiterungen mit JavaScript und CSS sollten gekapselt in eigenen Dateien abgelegt werden. Achte auf die Verzeichnisrechte (664 für Dateien und 775 für Verzeichnisse)

  • themename/assets/js/custom-function.php
  • themename/assets/css/custom-styles.css

Gekapseltes JavaScript und CSS kann dann über die functions.php eingebunden werden:

function mein_child_theme_skripte() {
    // Eigene Styles hinzufügen
    wp_enqueue_style('mein-child-theme-css', get_stylesheet_directory_uri() . '/assets/css/mein-stil.css');
    // Eigene JavaScript-Dateien hinzufügen
    wp_enqueue_script('mein-child-theme-js', get_stylesheet_directory_uri() . '/assets/js/mein-skript.js', array(), false, true);
}
add_action('wp_enqueue_scripts', 'mein_child_theme_skripte');

Darum ist ein Child-Theme in WordPress hilfreich

  1. Anpassungen sicher vornehmen: Ein Child-Theme ermöglicht es dir, Anpassungen an deinem Theme vorzunehmen, ohne das Original-Theme (auch Parent-Theme genannt) zu verändern. Dies bedeutet, dass du Updates für das Parent-Theme installieren kannst, ohne dass deine Änderungen überschrieben werden. Ohne ein Child-Theme könnten benutzerdefinierte Anpassungen verloren gehen, wenn das Parent-Theme aktualisiert wird.
  2. Einfache Updates: Da das Parent-Theme unverändert bleibt, kannst du sicher sein, dass du von den neuesten Sicherheitsupdates und Funktionen profitierst, die vom Theme-Entwickler bereitgestellt werden, ohne deine Anpassungen zu verlieren.
  3. Lernen und Experimentieren: Für Anfänger oder Entwickler, die neue Techniken ausprobieren möchten, bietet ein Child-Theme eine großartige Umgebung, um mit WordPress zu experimentieren, ohne sich Sorgen machen zu müssen, das Haupttheme zu beschädigen oder ungewollte Änderungen vorzunehmen.
  4. Vererbung der Theme Funktionen: Ein Child-Theme erbt alle Funktionen, Stile und Vorlagen des Parent-Themes. Das bedeutet, dass du nicht von Grund auf neu beginnen musst, wenn du ein Design oder eine Funktionalität ändern möchtest. Stattdessen kannst du auf der Arbeit aufbauen, die bereits im Parent-Theme geleistet wurde.
  5. Benutzerdefinierte Anpassungen trennen: Durch die Verwendung eines Child-Themes kannst du benutzerdefinierte Anpassungen von den Kernfunktionen des Parent-Themes trennen. Das macht es einfacher, den Überblick über Änderungen zu behalten und sicherzustellen, dass benutzerdefinierte Funktionen klar von denen des Parent-Themes getrennt sind.

Insgesamt verbessert die Verwendung eines Child-Themes die Wartbarkeit, Sicherheit und Flexibilität deiner WordPress-Website und ist eine bewährte Praxis für die WordPress-Entwicklung.