SlideShare a Scribd company logo
The
Child Theme Dilemma
WordCamp Cologne 2015
Torsten Landsiedel
Hello!
Torsten Landsiedel
WordPress- Freelancer
Moderator German Supportforum
Editor Team de.w.org
Translation Contributor and Editor
Co-Organisator WP Meetup Hamburg
Co-Organisator WordCamp Hamburg
@zodiac1978
Child Theme Usage
Who has used Child Themes?
Child Theme Usage
Why?
Child Theme Problems
Security
Extensibility
Performance
Security Problems
Parent Theme
search.php (with
vulnerability)
Child Theme
search.php (with
vulnerability)
Parent Theme
search.php (without
vulnerability)
Child Theme
search.php (with
vulnerability)
update
overwrites
no update!overwrites
Child Themes aren’t safe?
Why nobody told us?
Extensibility
Pluggable Functions:
if ( ! function_exists( 'theme_special_nav' ) ) {
function theme_special_nav() {
// Do something.
}
}
Attention:
Now you have to maintain the code!
Missing extensibilities
Framework Theme + Premium Child Theme?
WordPress.org Theme + Child Theme?
Where to put the customizations?
Thre are no Grandchild Themes :(
Missing extensibilities
Why shouldn’t there be Grandchild Themes?
Missing extensibilities
This idea of releasing advanced child themes just creates
the same problem child themes were meant to solve:
upgradability.
– Justin Tadlock
http://justintadlock.com/archives/2010/08/16/frameworks-parent-child-
and-grandchild-themes
Update of Parent Theme
Without any problems?
It depends …
filter/actions removed?
CSS classes changed?
Markup changed?
Paths changed?
Performance Problems
Many Child Themes are using @import
@import url(../parent-theme/style.css);
But @import stops parallel loading
in all browsers.
http://www.stevesouders.com/blog/2009/04/09/dont-use-import/
Solution:
De-register styles und re-register/re-enqeue parent and
child styles
function twentytwelve_child_scripts() {
wp_deregister_style( 'twentytwelve-style' );
wp_register_style( 'twentytwelve-style',
get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'twentytwelve-child-style',
get_stylesheet_uri(), array( 'twentytwelve-style' ) );
}
add_action( 'wp_enqueue_scripts', 'twentytwelve_child_scripts', 11 );
Performance problems
Even simpler:
Enqueue parent styles. Done! Just works if
get_stylesheet is used (and just this) in the parent
theme.
// Faster than @import
add_action( 'wp_enqueue_scripts', 'my_child_theme_scripts' );
function my_child_theme_scripts() {
wp_enqueue_style( 'parent-theme-css', get_template_directory_uri() .
'/style.css' );
}
Performance problems
New problem:
Many themes are not build that way.
Hardcoded stylesheets in the header.php for example:
<link rel="stylesheet" type="text/css" media="all"
href="<?php bloginfo( 'stylesheet_url' ); ?>" />
Performance problems
Performance problems
Or the theme is not compatible with using a child
theme.
Or you have to de-register everything to preserve the
correct order.
wp_enqueue_style( 'base_styles',
get_template_directory_uri() . '/css/base.css' );
wp_enqueue_style( 'responsive_styles',
get_template_directory_uri() . '/css/mobile.css' );
wp_enqueue_style( 'ie_styles',
get_template_directory_uri() . '/css/ie.css' );
Performance Problems
Can be very complicated for beginners ...
Performance Problems
Justin Tadlocks brilliant solution for the parent theme:
function my_enqueue_styles() {
/* If using a child theme, auto-load the parent theme style. */
if ( is_child_theme() ) {
wp_enqueue_style( 'parent-style',
trailingslashit( get_template_directory_uri() ) . 'style.css' );
}
/* Always load active theme's style.css. */
wp_enqueue_style( 'style', get_stylesheet_uri() );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_styles' );
http://justintadlock.com/archives/2014/11/03/loading-parent-styles-for-child-themes
Hey Torsten!
Grab some water.
Don’t speak too fast.
:)
Child Theme Problems
Security
Extensibilities
Performance ✓
Idea 1: Child Theme Lite
“Child themes from theme developers should be nothing
more than a stylesheet and a few functions.”
– Justin Tadlock
http://justintadlock.com/archives/2010/08/16/frameworks-parent-child-and-grandchild-themes
Idea 1: Child Theme Lite
Child Theme just contains functions.php
and style.css.
All changes should just be made with hooks
and filters.
This would be made within a plugin.
Child Theme remains update-ability.
Idea 1: Child Theme Lite
Problem:
How many themes do something like that?
Idea 2: Child Theme Check
Every template file in the theme is ghetting a version
number in the file header.
@version 1.0.0
Check of the version number via plugin
(or even better via WordPress core).
Differences between files can be shown via
wp_text_diff().
Idea 2: Child Theme Check
DEMO!
Child Theme Check
Voilá!
Child Theme Check
Child Theme Check
https://github.com/Zodiac1978/tl-template-checker
- This is a Twitter opportunity! -
Child Theme Problems
Security ✓
Extensibilities (✓)
Performance ✓
● Is Tools the right choice for the menu? Or should it be
Appearance?
● Just open an issue on Github:
https://github.com/Zodiac1978/tl-template-checker/issues
Conribute? Great!
Thank you for your feedback!
Discussion!
Questions? Contradiction? Alternative solutions?
Theme Shop/Theme Developer: Interested?
Let’s speak about it!
@zodiac1978
http://torstenlandsiedel.de/kontakt
Thank you for your time!
Safe travels! :)

More Related Content

Similar to The Child Theme Dilemma (EN)

WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themes
rfair404
 
Week 9 - Introduction to Child Themes
Week 9  - Introduction to Child ThemesWeek 9  - Introduction to Child Themes
Week 9 - Introduction to Child Themes
henri_makembe
 
2009-08-28-WordPress-Parent-Child-Themes
2009-08-28-WordPress-Parent-Child-Themes2009-08-28-WordPress-Parent-Child-Themes
2009-08-28-WordPress-Parent-Child-Themes
LightSpeed
 
Theme frameworks & child themes
Theme frameworks & child themesTheme frameworks & child themes
Theme frameworks & child themes
Chris Olbekson
 

Similar to The Child Theme Dilemma (EN) (20)

WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themes
 
WP Joburg Meetup 10: Genesis Framework by Trish Cornelius
WP Joburg Meetup 10: Genesis Framework by Trish CorneliusWP Joburg Meetup 10: Genesis Framework by Trish Cornelius
WP Joburg Meetup 10: Genesis Framework by Trish Cornelius
 
Week 9 - Introduction to Child Themes
Week 9  - Introduction to Child ThemesWeek 9  - Introduction to Child Themes
Week 9 - Introduction to Child Themes
 
Introduction to WordPress Child Theming, WordCamp Kansas City, 2015
Introduction to WordPress Child Theming, WordCamp Kansas City, 2015Introduction to WordPress Child Theming, WordCamp Kansas City, 2015
Introduction to WordPress Child Theming, WordCamp Kansas City, 2015
 
Responsive Theme Workshop - WordCamp Columbus 2015
Responsive Theme Workshop - WordCamp Columbus 2015Responsive Theme Workshop - WordCamp Columbus 2015
Responsive Theme Workshop - WordCamp Columbus 2015
 
Child Theme
Child ThemeChild Theme
Child Theme
 
Firstborn child theme word camp presentation - atlanta 2013
Firstborn child theme   word camp presentation - atlanta 2013Firstborn child theme   word camp presentation - atlanta 2013
Firstborn child theme word camp presentation - atlanta 2013
 
2009-08-28-WordPress-Parent-Child-Themes
2009-08-28-WordPress-Parent-Child-Themes2009-08-28-WordPress-Parent-Child-Themes
2009-08-28-WordPress-Parent-Child-Themes
 
Theme frameworks & child themes
Theme frameworks & child themesTheme frameworks & child themes
Theme frameworks & child themes
 
Child Themes (WordCamp Dublin 2017) with notes
Child Themes (WordCamp Dublin 2017) with notesChild Themes (WordCamp Dublin 2017) with notes
Child Themes (WordCamp Dublin 2017) with notes
 
Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919
 
The Way to Theme Enlightenment
The Way to Theme EnlightenmentThe Way to Theme Enlightenment
The Way to Theme Enlightenment
 
The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017
 
Child Themes - WordCamp Dublin 2017
Child Themes - WordCamp Dublin 2017Child Themes - WordCamp Dublin 2017
Child Themes - WordCamp Dublin 2017
 
Parent and child themes
Parent and child themesParent and child themes
Parent and child themes
 
Best practices in WordPress Development
Best practices in WordPress DevelopmentBest practices in WordPress Development
Best practices in WordPress Development
 
Responsive themeworkshop wcneo2016
Responsive themeworkshop wcneo2016Responsive themeworkshop wcneo2016
Responsive themeworkshop wcneo2016
 
How to make a WordPress theme
How to make a WordPress themeHow to make a WordPress theme
How to make a WordPress theme
 
Child Themes in WordPress
Child Themes in WordPressChild Themes in WordPress
Child Themes in WordPress
 
WordPress and Child Themes
WordPress and Child ThemesWordPress and Child Themes
WordPress and Child Themes
 

More from Torsten Landsiedel

More from Torsten Landsiedel (18)

Das Health Check Plugin in der Praxis
Das Health Check Plugin in der PraxisDas Health Check Plugin in der Praxis
Das Health Check Plugin in der Praxis
 
UX-Probleme mit dem neuen Block-Editor (Gutenberg)
UX-Probleme mit dem neuen Block-Editor (Gutenberg)UX-Probleme mit dem neuen Block-Editor (Gutenberg)
UX-Probleme mit dem neuen Block-Editor (Gutenberg)
 
Oh, no! DSGVO.
Oh, no! DSGVO.Oh, no! DSGVO.
Oh, no! DSGVO.
 
WordPress kaputt machen
WordPress kaputt machenWordPress kaputt machen
WordPress kaputt machen
 
Werde Übersetzer! Werde Translation Editor!
Werde Übersetzer!  Werde Translation Editor!Werde Übersetzer!  Werde Translation Editor!
Werde Übersetzer! Werde Translation Editor!
 
Die schmutzige Seite von WordPress
Die schmutzige Seite von WordPressDie schmutzige Seite von WordPress
Die schmutzige Seite von WordPress
 
Umgang mit Frustration im Open-Source-Projekt WordPress
Umgang mit Frustration im Open-Source-Projekt WordPressUmgang mit Frustration im Open-Source-Projekt WordPress
Umgang mit Frustration im Open-Source-Projekt WordPress
 
Wie ich durch Support und Übersetzung ein (besserer) Entwickler geworden bin
Wie ich durch Support und Übersetzung ein (besserer) Entwickler geworden binWie ich durch Support und Übersetzung ein (besserer) Entwickler geworden bin
Wie ich durch Support und Übersetzung ein (besserer) Entwickler geworden bin
 
Das Child-Theme-Dilemma
Das Child-Theme-DilemmaDas Child-Theme-Dilemma
Das Child-Theme-Dilemma
 
Contact Form 7 - Pflicht und Kür
Contact Form 7 - Pflicht und KürContact Form 7 - Pflicht und Kür
Contact Form 7 - Pflicht und Kür
 
Social Media Menüs in WordPress
Social Media Menüs in WordPressSocial Media Menüs in WordPress
Social Media Menüs in WordPress
 
Mitmachen bei WordPress
Mitmachen bei WordPressMitmachen bei WordPress
Mitmachen bei WordPress
 
MetaMeetup
MetaMeetupMetaMeetup
MetaMeetup
 
HTML/CSS-Validierung in Zeiten von HTML5
HTML/CSS-Validierung in Zeiten von HTML5HTML/CSS-Validierung in Zeiten von HTML5
HTML/CSS-Validierung in Zeiten von HTML5
 
Shortcodes erstellen mit WordPress
Shortcodes erstellen mit WordPressShortcodes erstellen mit WordPress
Shortcodes erstellen mit WordPress
 
WordPress absichern - WP Camp 2012 in Berlin
WordPress absichern - WP Camp 2012 in BerlinWordPress absichern - WP Camp 2012 in Berlin
WordPress absichern - WP Camp 2012 in Berlin
 
Podcasting mit WordPress.com-Blogs
Podcasting mit WordPress.com-BlogsPodcasting mit WordPress.com-Blogs
Podcasting mit WordPress.com-Blogs
 
WordPress.com-Blogs individualisieren
WordPress.com-Blogs individualisierenWordPress.com-Blogs individualisieren
WordPress.com-Blogs individualisieren
 

Recently uploaded

一比一原版UTS毕业证悉尼科技大学毕业证成绩单如何办理
一比一原版UTS毕业证悉尼科技大学毕业证成绩单如何办理一比一原版UTS毕业证悉尼科技大学毕业证成绩单如何办理
一比一原版UTS毕业证悉尼科技大学毕业证成绩单如何办理
aagad
 
Article writing on excessive use of internet.pptx
Article writing on excessive use of internet.pptxArticle writing on excessive use of internet.pptx
Article writing on excessive use of internet.pptx
abhinandnam9997
 

Recently uploaded (12)

How Do I Begin the Linksys Velop Setup Process?
How Do I Begin the Linksys Velop Setup Process?How Do I Begin the Linksys Velop Setup Process?
How Do I Begin the Linksys Velop Setup Process?
 
Multi-cluster Kubernetes Networking- Patterns, Projects and Guidelines
Multi-cluster Kubernetes Networking- Patterns, Projects and GuidelinesMulti-cluster Kubernetes Networking- Patterns, Projects and Guidelines
Multi-cluster Kubernetes Networking- Patterns, Projects and Guidelines
 
The+Prospects+of+E-Commerce+in+China.pptx
The+Prospects+of+E-Commerce+in+China.pptxThe+Prospects+of+E-Commerce+in+China.pptx
The+Prospects+of+E-Commerce+in+China.pptx
 
How to Use Contact Form 7 Like a Pro.pptx
How to Use Contact Form 7 Like a Pro.pptxHow to Use Contact Form 7 Like a Pro.pptx
How to Use Contact Form 7 Like a Pro.pptx
 
一比一原版UTS毕业证悉尼科技大学毕业证成绩单如何办理
一比一原版UTS毕业证悉尼科技大学毕业证成绩单如何办理一比一原版UTS毕业证悉尼科技大学毕业证成绩单如何办理
一比一原版UTS毕业证悉尼科技大学毕业证成绩单如何办理
 
The AI Powered Organization-Intro to AI-LAN.pdf
The AI Powered Organization-Intro to AI-LAN.pdfThe AI Powered Organization-Intro to AI-LAN.pdf
The AI Powered Organization-Intro to AI-LAN.pdf
 
ER(Entity Relationship) Diagram for online shopping - TAE
ER(Entity Relationship) Diagram for online shopping - TAEER(Entity Relationship) Diagram for online shopping - TAE
ER(Entity Relationship) Diagram for online shopping - TAE
 
The Use of AI in Indonesia Election 2024: A Case Study
The Use of AI in Indonesia Election 2024: A Case StudyThe Use of AI in Indonesia Election 2024: A Case Study
The Use of AI in Indonesia Election 2024: A Case Study
 
Pvtaan Social media marketing proposal.pdf
Pvtaan Social media marketing proposal.pdfPvtaan Social media marketing proposal.pdf
Pvtaan Social media marketing proposal.pdf
 
The Best AI Powered Software - Intellivid AI Studio
The Best AI Powered Software - Intellivid AI StudioThe Best AI Powered Software - Intellivid AI Studio
The Best AI Powered Software - Intellivid AI Studio
 
Article writing on excessive use of internet.pptx
Article writing on excessive use of internet.pptxArticle writing on excessive use of internet.pptx
Article writing on excessive use of internet.pptx
 
History+of+E-commerce+Development+in+China-www.cfye-commerce.shop
History+of+E-commerce+Development+in+China-www.cfye-commerce.shopHistory+of+E-commerce+Development+in+China-www.cfye-commerce.shop
History+of+E-commerce+Development+in+China-www.cfye-commerce.shop
 

The Child Theme Dilemma (EN)

  • 1. The Child Theme Dilemma WordCamp Cologne 2015 Torsten Landsiedel
  • 2. Hello! Torsten Landsiedel WordPress- Freelancer Moderator German Supportforum Editor Team de.w.org Translation Contributor and Editor Co-Organisator WP Meetup Hamburg Co-Organisator WordCamp Hamburg @zodiac1978
  • 3. Child Theme Usage Who has used Child Themes?
  • 6. Security Problems Parent Theme search.php (with vulnerability) Child Theme search.php (with vulnerability) Parent Theme search.php (without vulnerability) Child Theme search.php (with vulnerability) update overwrites no update!overwrites
  • 7. Child Themes aren’t safe? Why nobody told us?
  • 8. Extensibility Pluggable Functions: if ( ! function_exists( 'theme_special_nav' ) ) { function theme_special_nav() { // Do something. } } Attention: Now you have to maintain the code!
  • 9. Missing extensibilities Framework Theme + Premium Child Theme? WordPress.org Theme + Child Theme? Where to put the customizations? Thre are no Grandchild Themes :(
  • 10. Missing extensibilities Why shouldn’t there be Grandchild Themes?
  • 11. Missing extensibilities This idea of releasing advanced child themes just creates the same problem child themes were meant to solve: upgradability. – Justin Tadlock http://justintadlock.com/archives/2010/08/16/frameworks-parent-child- and-grandchild-themes
  • 12. Update of Parent Theme Without any problems? It depends … filter/actions removed? CSS classes changed? Markup changed? Paths changed?
  • 13. Performance Problems Many Child Themes are using @import @import url(../parent-theme/style.css); But @import stops parallel loading in all browsers. http://www.stevesouders.com/blog/2009/04/09/dont-use-import/
  • 14. Solution: De-register styles und re-register/re-enqeue parent and child styles function twentytwelve_child_scripts() { wp_deregister_style( 'twentytwelve-style' ); wp_register_style( 'twentytwelve-style', get_template_directory_uri() . '/style.css' ); wp_enqueue_style( 'twentytwelve-child-style', get_stylesheet_uri(), array( 'twentytwelve-style' ) ); } add_action( 'wp_enqueue_scripts', 'twentytwelve_child_scripts', 11 ); Performance problems
  • 15. Even simpler: Enqueue parent styles. Done! Just works if get_stylesheet is used (and just this) in the parent theme. // Faster than @import add_action( 'wp_enqueue_scripts', 'my_child_theme_scripts' ); function my_child_theme_scripts() { wp_enqueue_style( 'parent-theme-css', get_template_directory_uri() . '/style.css' ); } Performance problems
  • 16. New problem: Many themes are not build that way. Hardcoded stylesheets in the header.php for example: <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" /> Performance problems
  • 17. Performance problems Or the theme is not compatible with using a child theme. Or you have to de-register everything to preserve the correct order. wp_enqueue_style( 'base_styles', get_template_directory_uri() . '/css/base.css' ); wp_enqueue_style( 'responsive_styles', get_template_directory_uri() . '/css/mobile.css' ); wp_enqueue_style( 'ie_styles', get_template_directory_uri() . '/css/ie.css' );
  • 18. Performance Problems Can be very complicated for beginners ...
  • 19. Performance Problems Justin Tadlocks brilliant solution for the parent theme: function my_enqueue_styles() { /* If using a child theme, auto-load the parent theme style. */ if ( is_child_theme() ) { wp_enqueue_style( 'parent-style', trailingslashit( get_template_directory_uri() ) . 'style.css' ); } /* Always load active theme's style.css. */ wp_enqueue_style( 'style', get_stylesheet_uri() ); } add_action( 'wp_enqueue_scripts', 'my_enqueue_styles' ); http://justintadlock.com/archives/2014/11/03/loading-parent-styles-for-child-themes
  • 20. Hey Torsten! Grab some water. Don’t speak too fast. :)
  • 22. Idea 1: Child Theme Lite “Child themes from theme developers should be nothing more than a stylesheet and a few functions.” – Justin Tadlock http://justintadlock.com/archives/2010/08/16/frameworks-parent-child-and-grandchild-themes
  • 23. Idea 1: Child Theme Lite Child Theme just contains functions.php and style.css. All changes should just be made with hooks and filters. This would be made within a plugin. Child Theme remains update-ability.
  • 24. Idea 1: Child Theme Lite Problem: How many themes do something like that?
  • 25. Idea 2: Child Theme Check Every template file in the theme is ghetting a version number in the file header. @version 1.0.0 Check of the version number via plugin (or even better via WordPress core). Differences between files can be shown via wp_text_diff().
  • 26. Idea 2: Child Theme Check DEMO!
  • 30. Child Theme Problems Security ✓ Extensibilities (✓) Performance ✓
  • 31. ● Is Tools the right choice for the menu? Or should it be Appearance? ● Just open an issue on Github: https://github.com/Zodiac1978/tl-template-checker/issues Conribute? Great!
  • 32. Thank you for your feedback!
  • 33. Discussion! Questions? Contradiction? Alternative solutions? Theme Shop/Theme Developer: Interested? Let’s speak about it! @zodiac1978 http://torstenlandsiedel.de/kontakt
  • 34. Thank you for your time! Safe travels! :)