How To Create A WordPress Child Theme — And Why You’ll Likely Want To Use One
One of the biggest benefits of using WordPress is the ability to take advantage of a huge number of ready-made themes — all of which can be customized by users with relative ease. But with all that customizability comes the question of maintenance: What happens if you make your customizations and then the theme you’re using gets updated?
This is a question far too many users end up learning the answer to the hard way: If you update a theme after you’ve made customizations, all of the changes you’ve made to the original theme files will be overwritten — and if you didn’t backup your site (and you should ALWAYS make sure you have a complete backup before making any changes), then all that hard work will be lost.*
To avoid this tragic scenario, there’s one thing every WordPress user needs to do: Create (and use) child themes on every WordPress install.
What is a Child Theme — How Does it Work?
A WordPress child theme is really nothing more than a separate theme that relies on its parent theme for most (if not all) of its functionality. In its most basic form, a child theme is just a separate CSS style sheet that WordPress displays instead of the styles in the parent theme. This allows you to make changes to your theme without losing the custom styling you’ve created each time the parent theme gets updated.
More complex child themes can include additional functionality, too. Just like with the design elements, WordPress will check the child theme for functions first. If none are found, they will default to the functions of the parent theme. If there are functions, the functions in the child theme will be used instead of, or in addition to, those in the parent theme.
How to Create a WordPress Child Theme
I hope that by this point I’ve convinced you that child themes are very necessary. Of course, that doesn’t mean they aren’t intimidating to some people. But there’s good news: A WordPress child theme is extremely easy to create.
The first step to manually creating a WordPress child theme is accessing your theme directory under wp-content/themes. You can do this via an FTP client or, in many cases, via an interface provided by your hosting service.
Next, you’ll need to create a new directory for your child theme. You can name it anything you like. I’d recommend keeping it simple and easily understandable. Something like themename-child should do nicely.
The All-Important Custom CSS File (Mandatory)
Once you’ve completed those two steps, it’s time to add (at the bare minimum) the CSS style sheet that will define your child theme. To do that, simply create a text file (using an appropriate text editor, of course) named style.css, and copy and paste the following code into it:
/*
Theme Name: Twenty Thirteen Child
Theme URI: http://example.com/twenty-thirteen-child/
Description: Twenty Thirteen Child Theme
Author: John Doe
Author URI: http://example.com
Template: twentythirteen
Version: 1.0.0
*/
@import url(“../twentythirteen/style.css”);
/* =Theme customization starts here
——————————————————– */
[/css]
You’ll want to change the information above to reflect the files you’re actually working with, and it’s extremely important to make sure your ‘Template’ and ‘@import’ sections are correct in this step. Remember: Everything is case sensitive!
Once you’ve adjusted the information above to reflect your specific data, you can go ahead and enter your CSS theme customizations in the space provided and save the file. Tada! You’ve just created a child theme. Congratulations!
To activate your new child theme, all you have to do is zip the child theme folder you’ve created (the one containing the above CSS file), and install it via Appearances > Themes in your WordPress Admin, just like you would with any other WordPress theme. Alternatively, you could leave it unzipped and upload it to your themes directory using an FTP client.
But let’s say you’d like to create a slightly more complex child theme — one that goes beyond mere CSS customizations. How would you go about adding custom PHP functions, or altering actual theme files or templates?
Editing The Functions.php File (Optional)
In the case of editing your theme’s functions.php file, simply create a new functions.php file like the one below, then add this to your child theme. Any function within this new file will automatically override functions in your parent theme’s file. Anything not specified in this new file will simply default to the original.
<?php
// your code goes here
?>
[/php]
Editing Template Files (Optional)
Editing PHP template files is a bit different from editing CSS styles and functions. In the two previous examples, all you had to do was create files that housed your additions and/or overriding changes. In both cases, the new files in the child theme were more or less supplementary to the files in the parent theme — but when it comes to PHP template files you have to replace all of the content of the original with a new file in your child theme.
You accomplish this by copying the PHP template you want to edit, and then placing it in the same file tree location in the child theme files that it occupies in the parent theme files. WordPress will now entirely ignore the original, and whatever changes you make to the duplicate file in the child theme will be what WordPress actually uses.
Keep in mind, however, that you only want to add files to your child theme that you actually want to make changes to — i.e. don’t go needlessly copying in a whole load of files. This is because when the parent theme gets updated you may still, in some edge case scenarios, need to make sure that there are no important updates to the template files you’ve chosen to edit and/or include.
So Why Doesn’t Everybody Use Child Themes?
Aside from people simply not being aware of the need to create a child theme, the only really good reasons not to create/use child themes are because either you don’t intend to make any changes to the theme files (meaning you can simply use your theme exactly how the developer made it) or the theme you’re using provides a special interface in its theme options within which to make (and save) all the changes you need. It’s worth noting that many themes provide an interface to make custom CSS changes, for example.
Another (not-so-justifiable) reason to not use a child theme is because, if you’re looking to make anything more than CSS changes, it will almost invariably require a little (and sometimes a lot) of additional familiarity with the way the original parent theme is made. This can often feel like a chore. If this sounds familiar, then you’ll likely be in deep water if/when your theme gets a critical update!
The Takeaway Message
Assuming you intend on keeping your theme up to date (which is an extremely good idea), using a child theme is essential best practice.** Thankfully, it’s only a few minutes’ work to create one, so, if you haven’t already, then now’s the time!
Notes, Tips and Hints
For more on WordPress child themes, be sure to check out the official WordPress Codex.
*On Backups: There’s a lot of emphasis on making backups. Even with a backup, you’ll still be in deep water when it comes to updating your theme if you’ve been making direct edits to it, since you’ll likely still need to apply the new update. This is especially true if that update has anything to do with patching newly discovered security holes. Unless you’re somehow able to replicate all of the various changes you’ve made, your backup may not actually be all that helpful in getting you out of the situation!
**On Best Practice: If you’re still not convinced about using child themes, don’t take my word on why. Take WordPress co-founder Matt Mullenweg‘s: “Child themes and a framework are the only way you should build your WordPress site” — (said while talking about the Genesis Framework).
Any great tips for using/creating WordPress child themes? Thought?
All comments are held for moderation. We'll only publish comments that are on topic and adhere to our Commenting Policy.