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
- 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.
- 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
- Your sidebars, header or footer
- Other template parts such as comments or nav menus
- Custom post type archives
- Other WordPress theme files
Child Theme Advanced Topics
- Parent Themes (frameworks)
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