Short presentation on some child theme basics for WordPress.

1. WordPress Child Themes
by Alison Foxall, Designer & Partner @ Gobble Logic
@alisonmf
www.alisonfoxall.com
@gobblelogic
www.gobblelogic.com

2. By Definition
Child Theme
A theme that inherits the functionality of another theme, called
the parent theme, and allows you to modify, or add to, the
functionality of that parent theme.
Translation: A theme for a theme

3. Key Benefits
Protect your changes (from upgrading a parent theme)
i.e. You change the Twenty Eleven Theme around to better suit your
needs, but Oh! Look! WordPress wants to upgrade some things. You
get on a click-happy upgrade frenzy, and accidentally upgrade your
Twenty Eleven Theme to the newest version, and overwriting
everything you have worked for. You can avoid this heart-sinking
catastrophe by creating a Child Theme for Twenty Eleven instead.
Additional Functionality (cooler features)
i.e. Someone (or you) could make a theme that just does more for
you in terms of functionality, with the same look and feel of Twenty
Eleven. Creating this Child Theme would enable you to keep these
features without them getting overwritten.

4. Remember!
Child Themes Should...
Realistically a child theme should be nothing more than a stylesheet
and some additional functions. Nothing crazy. Too much, and you
should be making a parent theme, otherwise problems can occur
with upgradability.

5. Creating a Child Theme
Directory Hierarchy
Child Themes reside in the same folder as the ‘themes’ folder. It
does NOT reside in the parent theme folder. e.g.
themes
twentyeleven
twentyeleven-mychild
twentyten
Style.css
This is needed in the folder to actually create a theme

6. Style.css
Carry on as normal except...
As with any WordPress theme, the information header must be at
the top of the file, the only difference being that in a child theme
the Template: line is required, so that WordPress knows which
theme is the parent of the child theme. It should be the directory
name of the folder, case sensitive.
/*
Theme Name: Twenty Eleven Child
Theme URI: http://example.com/
Description: Child theme for the Twenty Eleven theme
Author: Your name here
Author URI: http://example.com/about/
Template: twentyeleven
Version: 0.1.0
*/

7. Noted
Overrides
Your new style.css will OVERRIDE the parent style.css. With this in
mind, @import your parent stylesheet and then start making your
changes. You do not need to use the !important declaration.
Other Paths
Lesson Learned: Don’t use bloginfo(stylesheet_directory) in your
parent themes when linking to files.
Instead, use something like this to obtain a uri path for javascript
libraries, css, and other paths in your template files:
echo get_template_directory_uri()

8. Demo Time!

9. Thank You!
afox@gobblelogic.com
@alisonmf
@tampabaywp
tampabaywp.com