We’ve all been there: the crossroads of updating your theme and overwriting the edits you made to it.

Either you have to leave your theme out of date or erase all the work you put into customizing it. Maybe you’re lucky and the changelog specifies which files are new so you can update manually, but this can be meticulous and time wasting. There must be an easier way!

Why Child Themes are Useful

Child themes are the root of customization. They allow you to customize your themes, while keeping the main theme intact so updating won’t erase your changes. Basically, a child theme is a ‘new’ theme that simply loads the framework from the parent theme. This way, whenever you update the parent theme, the child theme is ‘updated’ too. Neat!

Note: For minor CSS changes, use the Custom CSS box located in your Theme Options; for any PHP customization, use a Child Theme.

How to Create a WordPress Child Theme for 2014 Theme

The process to create a WordPress child theme is relatively easy, but some themes may take extra effort. For this example, we’ll use the latest WordPress Theme 2014.

1. Create Child Theme Directory

The first step is to create a ‘new theme’ that WordPress can load in Appearance>Themes. FTP to your server, navigate to /wp-content/themes/ and create a new folder called ‘twentyfourteen-child’.

Note: The name of this folder does not matter, it is for internal labeling purposes and WordPress does not read it.

2. Create Child Theme Stylesheet

This is where things get interesting. Open your new child theme directory and create a new file called style.css.

In this file, you’ll get to name your theme and set up all the metadata that shows in Appearance>Themes. This file will also tell WordPress where the parent theme is, so make sure to use the correct URI.

Default style.css code:

Theme Name:   Twenty Fourteen Child
 Theme URI:    http://example.com/twenty-fourteen-child/
 Description:  Twenty Fourteen Child Theme
 Author:       John Doe
 Author URI:   http://example.com
 Template:     twentyfourteen
 Version:      1.0.0
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-fourteen-child
*/

@import url("../twentyfourteen/style.css");

/* =Theme customization starts here
-------------------------------------------------------------- */

Note: The ../ notation refers to the parent folder. In this case, it refers to /wp-content/themes/.

3. Extend the Functions.php File

The cool thing about a child theme is that it can overwrite the parent theme files without actually editing them. Simply add the same file to the child theme directory and it will overwrite it. For example, if you wanted a different header, you would add header.php to your child theme directory.

This is not the case for functions.php however. For child themes, creating a new functions.php will simply extend the old file. This is so you can add new functions without the need to duplicate the entire functions.php file. In your child theme directory, create a file called functions.php and make sure to add the PHP tag to the top and bottom. Afterwards, you can add any new functions!

Note: To quickly make small modifications to page templates, just copy the parent theme file to the child theme directory.

That’s It

You can now activate your child theme in Appearance>Themes and can edit any theme files you want without disrupting the critical theme updates!
So, what changes will you make to your child theme?