SlideShare a Scribd company logo
WordPress Child Theme Overview By Russell Fair for  Atlanta WordPress Developers and Designers Meetup Group  7.27.2011
Who's your (theme's) daddy?
Child Theme Basics What is a Child Theme?  Why use Child Themes?  Who should use Child Themes?  How do Child Themes Work? How do I make a Child Theme?
What is a Child Theme? A Child Theme is a WordPress theme that relies on another theme (its parent theme) to provide some or all of the structure. A child theme MUST have at least a stylesheet with an appropriate comment block (See style.css in WordPress theme Hierarchy) When loading, a child theme will look to it's parent for files that it can not provide on its own Circa WordPress version 2.7
Why Use a Child Theme? Using a Child Theme allow you to update the parent theme easily without over-writing your customizations. If you offer themes as a service, parent themes allow you to have a streamlined, unified architecture and development process. WordPress MultiSite users – using child themes to create many “similar” themes with common architecture, but some differences, and ability to share more resources.
Who should use a Child Theme? Everyone!  According to WP Codex, Child theme is the recommended way to customize Web design companies who maintain their themes and want to streamline processes. Multi-site users/admins  Theme Authors who want to sell their themes in theme marketplaces
How do Child Themes Work? When WordPress is looping through the theme directory, it will try to match the request (query) with the right template file to use (e.g. page.php, single.php, archive.php, etc.) If it can not find the right template file in the child theme directory, it will scan the parent theme directory for the file. Works for get_template_part! Child themes are like Teenagers. If they have their own money, they will spend it; if they don't have their own money, they will get it from their parents.
 
How do I make a Child Theme? Step 1: Create a directory in your wp-content/themes directory for your theme (sub-directories not a good idea). Don't use spaces or special symbols.
Making a Child Theme Step 2: Create a valid stylesheet with comment block. Add Template: [parent-theme-directory] to the comment block to specify the parent theme.
Optional: Add custom theme files Functions.php Your sidebars, header or footer Other template parts such as comments or nav menus Custom post type archives Custom taxonomy archives Page templates Other WordPress theme files
Child Theme Advanced Topics Child Theme Functions Pluggable Functions Hooked Functions Filters Notes About Child Themes Parent Themes (frameworks) Child Theme Resources
Child Theme Functions (pluggable) There are two types of functions that your child theme can access, the first is a pluggable function. Pluggable functions are not just for themes. Pluggable function example from twentyeleven if ( ! function_exists( 'twentyeleven_setup' ) ): To override the twentyeleven setup just write your own twentyeleven_setup function in your child functions.php file.
Child Theme Functions  (hooked) Non Pluggable functions should be hooked using action hooks You can easily remove functions created by the parent theme, and supplement them with your child theme functions remove_action( 'init', 'hybrid_register_menus' ); add_action( 'init', 'mychild_register_menus' );
Parent Theme Frameworks Listed on WP Codex  http://codex.wordpress.org/Theme_Frameworks Thematic Theme (free, developer friendly) http://themeshaper.com/thematic-for-wordpress/ Hybrid Theme (free, paid support)  http://themehybrid.com/ Genesis Theme (premium, regular updates, developer friendly)  http://www.studiopress.com/themes Thesis Theme (premium, regular updates, highly customizable)  http://diythemes.com/
Notes about Child Themes Child themes may not be uploaded to WordPress.com or the WordPress.org theme repository (yet, as far as I know).  You CAN make 2nd, and 3 rd  level deep child themes (grand-child and great-grand-child) but DON'T. Never, ever, ever modify the parent theme without thorough testing when one or more child themes rely on it (yes even updates).
Child Theme Resources http://codex.wordpress.org/Child_Themes http://op111.net/53/ http://php.quicoto.com/wordpress-theme-hierarchy/ http://codex.wordpress.org/Theme_Development http://themehybrid.com/hybrid-core http://lorelle.wordpress.com/2008/12/30/parentchild-themes-in-wordpress-the-future-of-wordpress-themes/ http://wpcandy.com/uncategorized/frameworks-child-themes-filters-and-hook

More Related Content

WordPress Child Themes

  • 1. WordPress Child Theme Overview By Russell Fair for Atlanta WordPress Developers and Designers Meetup Group 7.27.2011
  • 3. Child Theme Basics What is a Child Theme? Why use Child Themes? Who should use Child Themes? How do Child Themes Work? How do I make a Child Theme?
  • 4. What is a Child Theme? A Child Theme is a WordPress theme that relies on another theme (its parent theme) to provide some or all of the structure. A child theme MUST have at least a stylesheet with an appropriate comment block (See style.css in WordPress theme Hierarchy) When loading, a child theme will look to it's parent for files that it can not provide on its own Circa WordPress version 2.7
  • 5. Why Use a Child Theme? Using a Child Theme allow you to update the parent theme easily without over-writing your customizations. If you offer themes as a service, parent themes allow you to have a streamlined, unified architecture and development process. WordPress MultiSite users – using child themes to create many “similar” themes with common architecture, but some differences, and ability to share more resources.
  • 6. Who should use a Child Theme? Everyone! According to WP Codex, Child theme is the recommended way to customize Web design companies who maintain their themes and want to streamline processes. Multi-site users/admins Theme Authors who want to sell their themes in theme marketplaces
  • 7. How do Child Themes Work? When WordPress is looping through the theme directory, it will try to match the request (query) with the right template file to use (e.g. page.php, single.php, archive.php, etc.) If it can not find the right template file in the child theme directory, it will scan the parent theme directory for the file. Works for get_template_part! Child themes are like Teenagers. If they have their own money, they will spend it; if they don't have their own money, they will get it from their parents.
  • 8.  
  • 9. How do I make a Child Theme? Step 1: Create a directory in your wp-content/themes directory for your theme (sub-directories not a good idea). Don't use spaces or special symbols.
  • 10. Making a Child Theme Step 2: Create a valid stylesheet with comment block. Add Template: [parent-theme-directory] to the comment block to specify the parent theme.
  • 11. Optional: Add custom theme files Functions.php Your sidebars, header or footer Other template parts such as comments or nav menus Custom post type archives Custom taxonomy archives Page templates Other WordPress theme files
  • 12. Child Theme Advanced Topics Child Theme Functions Pluggable Functions Hooked Functions Filters Notes About Child Themes Parent Themes (frameworks) Child Theme Resources
  • 13. Child Theme Functions (pluggable) There are two types of functions that your child theme can access, the first is a pluggable function. Pluggable functions are not just for themes. Pluggable function example from twentyeleven if ( ! function_exists( 'twentyeleven_setup' ) ): To override the twentyeleven setup just write your own twentyeleven_setup function in your child functions.php file.
  • 14. Child Theme Functions (hooked) Non Pluggable functions should be hooked using action hooks You can easily remove functions created by the parent theme, and supplement them with your child theme functions remove_action( 'init', 'hybrid_register_menus' ); add_action( 'init', 'mychild_register_menus' );
  • 15. Parent Theme Frameworks Listed on WP Codex http://codex.wordpress.org/Theme_Frameworks Thematic Theme (free, developer friendly) http://themeshaper.com/thematic-for-wordpress/ Hybrid Theme (free, paid support) http://themehybrid.com/ Genesis Theme (premium, regular updates, developer friendly) http://www.studiopress.com/themes Thesis Theme (premium, regular updates, highly customizable) http://diythemes.com/
  • 16. Notes about Child Themes Child themes may not be uploaded to WordPress.com or the WordPress.org theme repository (yet, as far as I know). You CAN make 2nd, and 3 rd level deep child themes (grand-child and great-grand-child) but DON'T. Never, ever, ever modify the parent theme without thorough testing when one or more child themes rely on it (yes even updates).
  • 17. Child Theme Resources http://codex.wordpress.org/Child_Themes http://op111.net/53/ http://php.quicoto.com/wordpress-theme-hierarchy/ http://codex.wordpress.org/Theme_Development http://themehybrid.com/hybrid-core http://lorelle.wordpress.com/2008/12/30/parentchild-themes-in-wordpress-the-future-of-wordpress-themes/ http://wpcandy.com/uncategorized/frameworks-child-themes-filters-and-hook