@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
sogenannt...
@kirstenschelper
1. Man kann das Design anpassen (style.css)
2. Man kann Funktionen ergänzen 

(z.B. zusätzliche Menüs ode...
@kirstenschelper
1. Wenn man die Anpassungen, die man braucht, auch
über den Customizer machen kann
2. Wenn man eine Eierl...
@kirstenschelper
Wie macht man ein

Childtheme?
@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, ar...
@kirstenschelper
style.css
@kirstenschelper
Die style.css braucht einen header
Theme Name: Twentyfifteen Child
Description: Ein schönes Childtheme
Au...
Demo
@kirstenschelper
Parent-Styles einbinden (1)
Theme Name: Twentyfifteen Child
Description: Ein schönes Childtheme
Author: K...
@kirstenschelper
Parent-Styles einbinden (2)
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style',
get_templ...
@kirstenschelper
Warum nicht @import?
@import
• schlechte Performance
• hart gecodet = unmodern und unflexibel
enqueue
• g...
@kirstenschelper
Parent-Styles einbinden (3)
wp_deregister_style( 'twentyfifteen-style');
wp_register_style('twentyfifteen...
@kirstenschelper
Childtheme
bitte beachten
@kirstenschelper
Childtheme und Theme-Updates
• style.css + functions.php = sichere Sache
• header.php, single.php, archiv...
@kirstenschelper
Templates und Updates
• Templates, die vom Childtheme überschrieben
werden, werden beim Update des Parent...
@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...
@kirstenschelper
Childtheme
Fragen!
Nächste SlideShare
Wird geladen in …5
×

Arbeiten mit Childthemes

1.980 Aufrufe

Veröffentlicht am

Kurz-Vortrag beim WPmeetup München im Oktober 2015

Veröffentlicht in: Internet
0 Kommentare
0 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Keine Downloads
Aufrufe
Aufrufe insgesamt
1.980
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
1.114
Aktionen
Geteilt
0
Downloads
2
Kommentare
0
Gefällt mir
0
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

Arbeiten mit Childthemes

  1. 1. @kirstenschelper
  2. 2. Childthemes
  3. 3. Kirsten Schelper www.schelperdesign.net · www.die-netzialisten.de @kirstenschelper
  4. 4. @kirstenschelper Was ist ein
 Childtheme?
  5. 5. ?
  6. 6. – 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.“
  7. 7. @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
  8. 8. @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?
  9. 9. @kirstenschelper Wie macht man ein
 Childtheme?
  10. 10. @kirstenschelper Childtheme anlegen 1. Verzeichnis anlegen 2. style.css anlegen Fertig
  11. 11. @kirstenschelper Woraus besteht ein Childtheme? • style.css • functions.php • screenshot.png • [header.php, single.php, archive.php…]
  12. 12. @kirstenschelper style.css
  13. 13. @kirstenschelper Die style.css braucht einen header Theme Name: Twentyfifteen Child Description: Ein schönes Childtheme Author: Kirsten Schelper Author URI: http://www.schelperdesign.net Template: twentyfifteen Version: 1.0 Tags: light Text Domain: twentyfifteen-child */
  14. 14. Demo
  15. 15. @kirstenschelper Parent-Styles einbinden (1) Theme Name: Twentyfifteen Child Description: Ein schönes Childtheme Author: Kirsten Schelper Author URI: http://www.schelperdesign.net Template: twentyfifteen Version: 1.0 Tags: light */ @import url(../twentyfifteen/style.css);
  16. 16. @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)
  17. 17. @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
  18. 18. @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' );
  19. 19. @kirstenschelper Childtheme bitte beachten
  20. 20. @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?
  21. 21. @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
  22. 22. @kirstenschelper Die gute Nachricht: Da gibt’s ein Plugin für!
  23. 23. @kirstenschelper Plugin „Child Theme Check“ (1) https://wordpress.org/plugins/child-theme-check/
  24. 24. @kirstenschelper Plugin „Child Theme Check“ (2)
  25. 25. @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 • (…)
  26. 26. @kirstenschelper Childtheme Fragen!

×