Transcript
@kirstenschelper
Childthemes
Kirsten Schelper
www.schelperdesign.net · www.die-netzialisten.de
@kirstenschelper
@kirstenschelper
Was ist ein Childtheme?
?
– WordPress Codex
„Ein Childtheme ist ein Theme, das Funktionalität und Design von
einem anderen Theme erbt, dem sogenannten Parent-Theme.
Der Weg über Childthemes wird für Anpassungen von Themes
empfohlen.“
@kirstenschelper
1. Man kann das Design anpassen (style.css)
2. Man kann Funktionen ergänzen (z.B. zusätzliche Menüs oder Widget-Bereiche)
3. Updates vom Parent-Theme können problemlos durchgeführt werden (Childtheme beilbt davon unberührt)
4. Alle Änderungen bleiben übersichtlich, weil im Childtheme-Ordner nur wenige Dateien mit wenigen Zeilen Code liegen
Vorteile Childtheme
@kirstenschelper
1. Wenn man die Anpassungen, die man braucht, auch über den Customizer machen kann
2. Wenn man eine Eierlegend Wollmichsau (Divi, Enfold etc.) gekauft hat
Wann braucht man kein Childtheme?
@kirstenschelper
Wie macht man einChildtheme?
@kirstenschelper
Childtheme anlegen
1. Verzeichnis anlegen
2. style.css anlegen
Fertig
@kirstenschelper
Woraus besteht ein Childtheme?
• style.css • functions.php
• screenshot.png
• [header.php, single.php, archive.php…]
@kirstenschelper
style.css
@kirstenschelper
Die style.css braucht einen header
Theme Name: Twentyfifteen ChildDescription: Ein schönes ChildthemeAuthor: Kirsten SchelperAuthor URI: http://www.schelperdesign.netTemplate: twentyfifteenVersion: 1.0Tags: lightText Domain: twentyfifteen-child*/
Demo
@kirstenschelper
Parent-Styles einbinden (1)
Theme Name: Twentyfifteen ChildDescription: Ein schönes ChildthemeAuthor: Kirsten SchelperAuthor URI: http://www.schelperdesign.netTemplate: twentyfifteenVersion: 1.0Tags: light*/
@import url(../twentyfifteen/style.css);
@kirstenschelper
Parent-Styles einbinden (2)
function theme_enqueue_styles() {wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
= style.css vom Parent Theme laden (functions.php Childtheme wird zuerst geladen)
@kirstenschelper
Warum nicht @import?
@import
• schlechte Performance
• hart gecodet = unmodern und unflexibel
enqueue • gute Performance
• per functions.php steuerbar: – Plugins, die Scripte und CSS zusammenfassen – Reihenfolge mehrere CSS-Dateien
@kirstenschelper
Parent-Styles einbinden (3)wp_deregister_style( 'twentyfifteen-style');wp_register_style('twentyfifteen-style',
get_template_directory_uri(). '/style.css');wp_enqueue_style('twentyfifteen-style', get_template_directory_uri(). '/style.css');
wp_enqueue_style( 'childtheme-style', get_stylesheet_directory_uri().'/style.css', array('twentyfifteen-style') );}add_action( 'wp_enqueue_scripts', 'twentyfifteen_child_styles' );
@kirstenschelper
Childtheme bitte beachten
@kirstenschelper
Childtheme und Theme-Updates
• style.css + functions.php = sichere Sache
• header.php, single.php, archive.php …
Was passiert, wenn diese Dateien im Eltern-Theme ein Update bekommen?
@kirstenschelper
Templates und Updates
• Templates, die vom Childtheme überschrieben werden, werden beim Update des Parent-Themes NICHT aktualisiert
• Sicherheitslücken im Theme, die der Autor durch ein Update behoben hat, können so im Childtheme weiterleben
Achtung
@kirstenschelper
Die gute Nachricht: Da gibt’s ein Plugin für!
@kirstenschelper
Plugin „Child Theme Check“ (1)
https://wordpress.org/plugins/child-theme-check/
@kirstenschelper
Plugin „Child Theme Check“ (2)
@kirstenschelper
Childtheme Tipps• Plugin „Child Theme Check“ installieren,
Funktionen regelmäßig überprüfen (ab und zu mal wp_debug aktivieren)
• get_stylesheet_directory (statt get_template_directory)
• im Parent Theme nach! function_exists suchen, macht Funktionen einfach überschreibbar
• (…)
@kirstenschelper
Childtheme Fragen!
top related