Knowing the fact that a lot of our users are designers working with our WordPress themes it is no surprise that most of the times one will modify the themes’ files to get them looking the way they need for their clients, or to adapt the available functions to each project’s needs.

While opening and editing files directly from a theme may look as a simple and efficient solution it can be a little stressful when a newer version of the theme you’re using becomes available and you know that clicking the “Update” button can erase all your tweaks and modifications. Enter: the Child Theme.

From the Codex:

A WordPress child theme is a theme that inherits the functionality of another theme, called the parent theme. Child themes allow you to modify, or add to the functionality of that parent theme. A child theme is the safest and easiest way to modify an existing theme, whether you want to make a few tiny changes or extensive changes. Instead of modifying the theme files directly, you can create a child theme and override within.

A child theme is no more than a style.css file with very few lines that declare a theme a “child theme” of another theme. It may contain only that file, or as many files as you want, depending of what you need it to be. You install it as a regular theme, and activate it as a regular theme too (yes, you need to activate this one, instead of the theme you purchased or downloaded, but the last one needs to be installed as well).

The logic behind it is pretty straight forward. Once you activate your child theme you won’t notice any change at all. From there, anything that you add to your newly created child theme will override the same features/files from the parent theme. Let’s take a look at the three main possibilities a child theme offers you.

Adding/Modifying CSS Rules

The style.css file form your child theme will be loaded instead of the original style.css file of your parent theme. That means that in most cases you will get an empty file without any written rule. You can then import your original CSS file by adding an @import rule which will bring all your styles back to your theme:

@import url("../your-parent-theme/style.css");

(Artisan Themes users: you have all that already prepared and ready to be downloaded for each one of our themes. Go to Dashboard >> My Purchases and find the child theme for your theme.)

From there on, you can add new CSS rules in that file by navigating to Appearance >> Editor. Remember, anything you add here will override the previous styles.

On a side note to our users, in most of our themes you will find a Custom CSS Box under Theme Options >> Design which you can use to add overriding styles and it won’t be deleted nor when updating (of course, none of the other settings does) nor when restoring all your options to defaults. You don’t actually need to use a child theme here if all you want is to change a specific color or some margins.

Replacing Theme Functions

Sometimes you’ll need to add a specific function or to modify an already existing function of the theme to make it behave exactly as you want (sometimes it can be useful to add very detailed or new markup). In those cases, throwing a functions.php file inside your child theme folder will give you the necessary room for that.

Even more, if the you want to replace original functions and those same functions are wrapped in the parent theme with a “if_function_exists” conditional, your new function will be called before, and thus, prevailing over the old one. Keep in mind that unlike what happens with the style.css file, your new functions.php file gets called before the original one.

ArtisanThemes.io users, you will find a ready made functions.php file in your downloadable child theme. You can directly navigate to Appearance >> Editor, select it on the right column and add your functions in there.

Modifying Templates

In WordPress, a template is a file (or two, sometimes) that define the layout for a specific section of the theme. Examples of sections driven by templates are the sidebar (sidebar.php), the header (header.php) and the archive (archive.php). When using a child theme, you can modify the entire template by copying the files in charge of that section to your child theme, and plain editing them to your needs. You will need to copy them into the same named folder they reside in, maintaining the original folder structure that the parent theme has.

For instance, should you wanted to modify the header of your theme, copy your existing header.php file into the child theme’s folder, or just create a new one with your own needs. Any time the child theme has a different file for a file that exists in the parent theme, it will be loaded instead, replacing the old one. In that way, you get a really powerful tool to get down to the bones of your theme and edit it.

You can even add new files and complex templates this way. Check this section of the Codex for more info on this.

Updating a Parent Theme

That’s pretty much it! If you have followed this procedure, you’ll find that updating the parent theme when a new version is available doesn’t get as frustrating as before. You won’t loose any modifications and your precious and delicate work will be kept intact. You will still need to find out what has changed in the original theme to try and keep up with the author’s decisions on fixes and improvements to the files. Most themes will have a Changelog available somewhere, which is a raw list of files that were changed in someway in the new version. Checking those files and comparing them with the old ones with tools like this one, or this another one will be of great help.

If you need to make any modification to a Artisan Themes theme, any other than modifying CSS rules (which, again, you can use the Custom CSS Box for) feel free to download the previously created child theme for your theme, and have it ready to go in a few moments.