Zum Inhalt springen
Startseite » WP Snippets » Child Themen erstellen

Child Themen erstellen

Ein Child-Theme in WordPress ermöglicht es dir, Anpassungen an einem bestehenden Theme vorzunehmen, ohne dass die Änderungen bei einem Update des Parent-Themes verloren gehen. Hier ist eine Schritt-für-Schritt-Anleitung, wie du ein Child-Theme erstellst:

Schritt 1: Ordner für das Child-Theme erstellen

  1. Verbinde dich per FTP oder über den Dateimanager deines Hosting-Providers mit deinem WordPress-Verzeichnis.
  2. Navigiere zu /wp-content/themes/.
  3. Erstelle einen neuen Ordner für dein Child-Theme. Nenne ihn am besten parent-theme-name-child, wobei parent-theme-name der Name des Parent-Themes ist. Wenn das Parent-Theme zum Beispiel „Twenty Twenty-Three“ heißt, könnte der Ordner twentytwentythree-child heißen.

Schritt 2: style.css Datei erstellen

  1. Erstelle im Child-Theme-Ordner eine neue Datei namens style.css.
  2. Füge in diese Datei den folgenden Code ein:

.

/*
Theme Name:   Twenty Twenty-Three Child
Theme URI:    https://example.com/twentytwentythree-child
Description:  Ein Child-Theme für das Twenty Twenty-Three-Theme
Author:       Dein Name
Author URI:   https://example.com
Template:     twentytwentythree
Version:      1.0.0
Text Domain:  twentytwentythree-child
*/
  1. Wichtige Punkte:
    • Theme Name: Der Name deines Child-Themes.
    • Template: Der Verzeichnisname des Parent-Themes (achte auf Groß- und Kleinschreibung).
    • Text Domain: Wird für die Internationalisierung von Themes verwendet. Du kannst denselben Text-Domain-Namen wie dein Child-Theme verwenden.

Schritt 3: functions.php Datei erstellen

  1. Erstelle eine neue Datei namens functions.php im Child-Theme-Ordner.
  2. Füge den folgenden Code ein, um die Stylesheets des Parent-Themes zu vererben:
<?php
function my_theme_enqueue_styles() {
    $parent_style = 'parent-style'; // This is 'twentytwentythree-style' for the Twenty Twenty-Three 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');
  1. Hinweis: Dieser Code stellt sicher, dass die Styles des Parent-Themes und des Child-Themes korrekt geladen werden. Das get_template_directory_uri() lädt die style.css des Parent-Themes, und get_stylesheet_directory_uri() lädt die style.css des Child-Themes.

Schritt 4: Aktivieren des Child-Themes

  1. Gehe zu deinem WordPress-Dashboard.
  2. Navigiere zu Design > Themes.
  3. Du solltest dein neu erstelltes Child-Theme in der Liste der verfügbaren Themes sehen. Klicke auf „Aktivieren“, um es zu verwenden.

Schritt 5: Anpassungen vornehmen

  • Template-Dateien überschreiben: Du kannst beliebige Template-Dateien aus dem Parent-Theme in dein Child-Theme kopieren und dort anpassen. Wenn du zum Beispiel die header.php des Parent-Themes ändern möchtest, kopiere sie einfach in den Child-Theme-Ordner und bearbeite sie dort.
  • Eigene Funktionen hinzufügen: Du kannst weitere Funktionen in die functions.php des Child-Themes hinzufügen, um das Verhalten deiner Website zu ändern.
  • Styles anpassen: Füge CSS-Anpassungen direkt in die style.css deines Child-Themes ein.

Zusammenfassung

Ein Child-Theme bietet eine sichere und organisierte Möglichkeit, Anpassungen an einem bestehenden WordPress-Theme vorzunehmen. Durch die Verwendung eines Child-Themes bleiben deine Änderungen erhalten, auch wenn das Parent-Theme aktualisiert wird. Stelle sicher, dass du Änderungen und Anpassungen gründlich testest, bevor du sie auf einer Live-Website einsetzt.

Ähnliche Beiträge