Erstellung eines Child-Themes in WordPress: Umfassender Leitfaden

Erstellung eines Child-Themes in WordPress: Umfassender Leitfaden

Mika Kollmann 25/06/2024

Das Erstellen eines Child-Themes in WordPress ist eine gängige Praxis, um benutzerdefinierte Änderungen am Design Ihrer Website vorzunehmen, ohne das Original-Theme zu verändern. Dies ermöglicht es Ihnen, zukünftige Updates des Original-Themes problemlos zu installieren, ohne dass Ihre Anpassungen verloren gehen. Hier ist eine Schritt-für-Schritt-Anleitung zur Erstellung eines Child-Themes in WordPress.

Schritt 1: Erstellen des Child-Theme-Verzeichnisses

  1. Verbinden Sie sich mit Ihrem Server:
    • Nutzen Sie ein FTP-Programm (z.B. FileZilla) oder den Dateimanager Ihres Hosting-Providers, um sich mit Ihrem Server zu verbinden.
    • Navigieren Sie zum Verzeichnis wp-content/themes.
  2. Erstellen Sie ein neues Verzeichnis:
    • Erstellen Sie im Verzeichnis wp-content/themes einen neuen Ordner für Ihr Child-Theme. Nennen Sie den Ordner entsprechend dem Namen Ihres Parent-Themes, gefolgt von -child. Beispiel: twentytwentyone-child.

Schritt 2: Erstellen der style.css Datei

  1. Erstellen Sie die Datei:
    • Erstellen Sie im neu erstellten Verzeichnis eine Datei namens style.css.
  2. Fügen Sie den Header hinzu:
    • Öffnen Sie die Datei style.css in einem Texteditor (z.B. Notepad++, Sublime Text) und fügen Sie den folgenden Code hinzu:
/*
 Theme Name:     Twenty Twenty-One Child
 Theme URI:      http://example.com/twenty-twenty-one-child/
 Description:    Twenty Twenty-One Child Theme
 Author:         Ihr Name
 Author URI:     http://example.com
 Template:       twentytwentyone
 Version:        1.0.0
*/

Hinweis: Der Wert von Template muss exakt dem Verzeichnisnamen des Parent-Themes entsprechen.

Schritt 3: Erstellen der functions.php Datei

  1. Erstellen Sie die Datei:
    • Erstellen Sie im Child-Theme-Verzeichnis eine Datei namens functions.php.
  2. Fügen Sie den Enqueue-Code hinzu:
    • Öffnen Sie die Datei functions.php in einem Texteditor und fügen Sie den folgenden Code hinzu, um die Stylesheets des Parent-Themes zu laden:
<?php
function my_theme_enqueue_styles() {
    $parent_style = 'parent-style'; // This is 'twentytwentyone-style' for the Twenty Twenty-One theme.

    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')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

Schritt 4: Aktivieren des Child-Themes

  1. Navigieren Sie zum WordPress-Dashboard:
    • Gehen Sie zu Darstellung > Themes.
  2. Aktivieren Sie das Child-Theme:
    • Sie sollten das neu erstellte Child-Theme in der Liste der verfügbaren Themes sehen. Klicken Sie auf Aktivieren, um es zu aktivieren.

Schritt 5: Anpassen des Child-Themes

  1. CSS-Anpassungen:
    • Fügen Sie Ihre benutzerdefinierten CSS-Regeln zur Datei style.css hinzu, um das Erscheinungsbild Ihrer Website anzupassen.
  2. PHP-Anpassungen:
    • Erstellen Sie benutzerdefinierte PHP-Vorlagendateien im Child-Theme-Verzeichnis, um die Funktionalität Ihrer Website zu erweitern. Beispiel: Kopieren Sie die Datei header.php aus dem Parent-Theme-Verzeichnis in das Child-Theme-Verzeichnis und nehmen Sie dort Ihre Änderungen vor.

Zusätzliche Tipps

  • Sicherheitskopien: Machen Sie regelmäßig Backups Ihrer Dateien, insbesondere bevor Sie Änderungen vornehmen.
  • Dokumentation: Dokumentieren Sie Ihre Änderungen sorgfältig, um bei zukünftigen Anpassungen den Überblick zu behalten.
  • Kompatibilität: Testen Sie Ihr Child-Theme gründlich, um sicherzustellen, dass es mit dem Parent-Theme und anderen installierten Plugins kompatibel ist.

Fazit

Die Erstellung eines Child-Themes in WordPress ist eine effektive Methode, um Ihre Website anzupassen, ohne die Update-Fähigkeit des Parent-Themes zu beeinträchtigen. Durch das Befolgen dieser Schritte können Sie sicherstellen, dass Ihre Anpassungen sicher und zukunftssicher sind.

Ebenfalls interessant