Das Childtheme-Konzept

Warum?

Wenn man ein Theme modifiziert, gehen diese Änderungen bei dem nächsten Update das Themes verloren. Ein Childtheme verhindert das. Somit spart man sich einiges an Entwicklungszeit, wenn man das verwendete Maintheme aktualisiert. Nebenbei versteht man auch noch etwas besser, wie WordPress intern funktioniert 😉

Wie?

Man benötigt nur einen Ordner für das Childtheme (natürlich im Themas-Ordner) und zwei Dateien:

  • style.css
  • functions.php

Sinnvollerweise nennt man das Childtheme wie das Parenttheme, um das Postfix -Child erweitert Als nächstes muss die style.css gefüllt werden:

Beispiel-Header

Theme Name:   Twenty Fifteen Child
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  Twenty Fifteen Child Theme
 Author:       John Doe
 Author URI:   http://example.com
 Template:     twentyfifteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-fifteen-child

Die Werte in diesem Beispiel müssen natürlich an die eigenen Gegebenheiten angepasst werden, wobei der Wert bei Template dem Namen des Ordners des Parent-Themes entsprechen muss.
Zum Schluss müssen noch die Stylesheets der beiden Themes verbunden werden. Das regelt man über eine Funktion in der functions.php des Childthemes.

<?php
function my_theme_enqueue_styles() {

    $parent_style = 'parent-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen 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' );
?>

Wie der Parent-Style im Parenttheme genau heisst kann man in dessen functions.php herausfinden: man sucht nach der Funktion wp_enqueue_style(). Dort ist der korrekte Name angegeben, denn man dann in obigem Script verwenden muss.

Jetzt kann man das Theme aktivieren. Im Adminpanel sollte das Childtheme jetzt zur Auswahl stehen.