Child-Theme

Zuletzt aktualisiert: April 19, 2024

Start // Lexikon // Child-Theme

Die Arbeit an einem Child-Theme ist eine sichere und effiziente Möglichkeit, das Aussehen und die Funktionalität einer Website anzupassen, ohne die Intaktheit des ursprünglichen Website-Themes zu gefährden. Was genau ein Child-Theme ist, was die Vor- und Nachteile sind und wie man ein Child-Theme im Backend erstellt, erläutern wir Dir in diesem Beitrag. Außerdem werden wir uns mit den Alternativen zur Anpassung von Themes befassen.

Was ist ein Child-Theme?

Ein Child-Theme, auch als „Child“ bezeichnet, ist ein Untertheme des Hauptthemes der Website, das als „Parent-Theme“ bezeichnet wird. Es dient als eine Art Schutzschirm, der das Original-Theme schützt und modifiziert. Es wird häufig auf Content Management Systemen wie WordPress verwendet, damit das Original-Theme nicht direkt verändert wird. 

Warum sollte man ein Child-Theme verwenden?

Der Hauptvorteil eines Child-Themes ist, dass Du Anpassungen am Design und der Funktionalität Deiner Website vornehmen kannst, ohne dass diese Änderungen durch zukünftige Updates des Parent-Themes verloren gehen. Wenn Du Änderungen direkt im Parent-Theme vornimmst und dieses dann aktualisiert wird, werden die von Dir vorgenommenen Anpassungen überschrieben. Das kann nicht nur ziemlich frustrierend sein, sondern führt auch dazu, dass Du wertvolle Arbeitszeit erneut investieren musst.

Vor- und Nachteile eines Child-Themes

Vorteile

  • Sicherheit bei Updates: Änderungen bleiben erhalten, auch wenn das Parent-Theme aktualisiert wird.
  • Freiheit zu experimentieren: Änderungen können ohne Risiko ausprobiert werden, da das Parent-Theme unangetastet bleibt.
  • Spielwiese: Die Arbeit an einem Child-Theme ist ideal, um zu erlernen, wie WordPress Themes entwickelt werden.

Nachteile

  • Zusätzlicher Wartungsaufwand: Die regelmäßige Wartung einer Website ist wichtig! Es kann aber zeitaufwendig sein, sowohl das Parent- als auch das Child-Theme auf dem neuesten Stand zu halten.
  • Leistungseinbußen: Vor allem, wenn viele Skripte und Styles eingebunden werden, kann es zu zusätzlichen Ladezeiten kommen, was sich negativ auf die Performance Deiner Website auswirken kann. 
  • Komplexität: Ein Child Theme zu erstellen, kann für Anfänger herausfordernd sein, denn es sind mindestens Grundkenntnisse in HTML und CSS für die Erstellung und Pflege eines Child-Themes erforderlich. 

Anleitung zur Erstellung eines Child-Themes in WordPress

Schritt 1: Child-Theme-Verzeichnis erstellen

Beginne damit, ein neues Verzeichnis in Deinem wp-content/themes-Ordner zu erstellen. Benenne dieses Verzeichnis nach Deinem Child-Theme (in diesem Beispiel twentytwentyone-child).

Schritt 2: Style.css erstellen

Erstelle eine style.css-Datei im Child-Theme-Verzeichnis. Füge den folgenden head hinzu, der WordPress mitteilt, dass dies ein Child-Theme ist:
/*
Theme Name: Twenty Twenty-One Child
Theme URI: http://example.com/twenty-twenty-one-child/
Description: Twenty Twenty-One Child Theme
Author: digitallotsen
Author URI: https://digitallotsen.com
Template: twentytwentyone
Version: 1.0.0
*/

Schritt 3: Functions.php erstellen

Lege eine functions.php-Datei an, die dazu dient, Skripte und Stile des Parent-Themes zu laden. Füge folgenden PHP-Code ein:
<?php
function my_theme_enqueue_styles() {
wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
}
add_action('wp_enqueue_scripts', 'my_theme_enqueue_styles');
?>

Schritt 4: Aktivieren des Child-Themes

Gehe in Deinem WordPress-Dashboard zu „Design“ und dann zu „Themes“. Aktiviere dort Dein neu erstelltes Child-Theme.

Alternativen zum Child-Theme

Im folgenden stellen wir Dir 3 Alternativen zur Nutzung eines Child-Themes vor. 

Custom CSS im Customizer

WordPress hat eine standardmäßige Möglichkeit zur Anpassung der CSS-Einstellungen direkt im Customizer. Diese Änderungen sind updatefest. Sie werden in der Datenbank und nicht im Theme selbst gespeichert.

Theme-Frameworks

Einige Frameworks wie Genesis bieten eine stabilere Lösung für Anpassungen und können eine Alternative zu Child-Themes sein, insbesondere wenn regelmäßige Updates und professioneller Support gewünscht werden.

Verwendung von Plugins

Plugins wie „SiteOrigin CSS“ oder „Jetpack’s Custom CSS“ ermöglichen, benutzerdefiniertes CSS hinzuzufügen, ohne direkt in den Theme-Dateien zu arbeiten. Diese Methode bietet Dir eine einfache Benutzeroberfläche und die Möglichkeit der Preview.

Fazit: Child-Themes =  mehr Individualität und Sicherheit

Child-Themes ermöglichen Anpassungen an Deiner Website, die nicht durch Updates zunichtegemacht werden. Zudem bieten sie Dir eine gute Möglichkeit, neue Designs und Funktionen sicher zu testen. Trotz der Herausforderungen, die damit verbunden sein können, Child-Themes zu erstellen und zu pflegen, bieten sie eine solide Lösung für diejenigen, die ihre Website individuell gestalten möchten, ohne auf die Vorteile regelmäßiger Updates verzichten zu müssen. 

Du benötigst Unterstützung bei der Erstellung Deiner Website? Wir sind die erfahrene Webdesign Agentur an Deiner Seite! 

Weitere Tipps für die Optimierung Deiner Website bekommst Du in unserem Ratgeber und im Lexikon.

Autoren-Infos

Ich bin Christopher, Senior Expert Design und Ausbilder bei den digitallotsen.

Meine Spezialgebiete sind Webdesign, Illustration und Design.

>