Share this...
1
Share

Child themes seem perplexing to a lot of people. I recently answered a question on the WordPress support forums (which you can read here) in which I summarized a lot of what I have been explaining to people about child themes over the last few years. (At this point, all the websites I design using WordPress automatically begin with a child theme.) I thought I would expand upon it a bit here. Since the original thread was pretty much a series of questions and answers, it seemed a good structure to follow here.

Important!

This article isn’t about how to create a child theme, but about why you should use one.

Contents

What is a child theme?

According to WordPress, a child theme is a “a theme that inherits the functionality of another theme, called the parent theme”. It can be as simple or as complex as you need or want it to be.

In actual terms, a child theme is just a directory (i.e., a folder) with a single child theme style sheet in it. You can add other files as you need them, but this is the minimum requirement.

Do I have to have a child theme?

Not if you’re satisfied with the options you currently have with your theme. However, if you want to do something that your theme doesn’t do, you’ll need to use a child theme.

For example, let’s suppose that your theme has a “dark” and a “light” option. Suppose the dark isn’t dark enough, or that it’s too dark. Suppose that you want a red option, or a blue option. That is exactly the sort of thing a child theme is used for.

Why not just edit the theme files? There is an editor built in to the backend of WordPress, after all.

Yes, you can do that, but there are two major issues here:

The first is that you really need to know what you are doing. Theme files are generally a combination of PHP, HTML, CSS, and JavaScript. Something as simple as a missing semicolon can shut down your entire site. I saw this happen once in a PHP file; the surprised site owner told me “I didn’t think a single semicolon made that much a difference.” Unless you are absolutely sure of what you are doing, you risk shutting down your entire site, including the back end, which means that you won’t be able to get in and fix your mistake. At that point, the only way to fix it is to use FTP to upload a new copy of your theme, and all the changes you have made will be lost.

The second issue is that when your theme updates, you will lose any changes you have made to it. (And yes, you really need to apply updates when they are available.)

Do I have to update the theme I’m using?

In a word, yes. I frequently run into people who think that updates are more trouble than they’re worth, and who always choose never to update.

While it’s true that updates can frequently cause problems (especially updates to the WordPress core), updates do two important things for your site. First, they often offer new features that users have been asking for. Second, they plug security holes that were found in earlier versions of the theme, making your site more secure from hacking.

What are the benefits to using a child theme?

First, you can leave your current theme intact. It works, you know it works, and if you screw something up with your child theme, you can at least switch back to your current theme until you get things sorted out.

Second, you can update your current theme without worrying about losing the changes you’ve made through your child theme. That way, you can take advantage of new features as well as staying secure.

Third, and most importantly, you can do things that you couldn’t do with your regular theme.

What are the downsides to using a child theme?

As I said earlier, WordPress themes are built from a combination of PHP, HTML, and CSS (and often, JavaScript), so you need to have some familiarity with them in order to make a successful child theme. Fortunately, most of what you need to know you can find in the WordPress Codex, the WordPress support forums, or on Google. You can accomplish a lot of what you want to do by simple copy and paste.

It also is easiest to create and use a child theme if you have FTP access to your site. Not everybody does, and even if you do, then it’s another technology you need to understand. (Although once you have a good FTP client, it’s really easy.) If you don’t have FTP access to your site, then there are a number of child theme plugins available in the WordPress plugin repository. I haven’t used any of them, so I can’t speak to their quality.

Additionally, updates to your parent theme can occasionally cause compatibility issues with your child theme. This is generally caused by the theme creator using different css selectors. If that happens, using a tool like Firebug makes it easy to find them out and update your child theme. This doesn’t happen all that often, though.

How do I create a child theme?

There are good instructions available on the Codex here.

When should I create a child theme?

Like I said, some people are perfectly happy with the options their current WordPress theme offers. If that’s you, you never need to worry about creating a child theme.

However, the minute that you start thinking “I wish my theme did…” that’s when you should create a child theme. As I indicated earlier, every web site that I develop using WordPress, I now start with a child theme, because I know that’s where I’m going to end up eventually.

What if I’ve already made changes to my original theme?

Now you have a bit of a problem, but don’t worry. It’s perfectly manageable, but it’s going to take some time.

First, FTP to your web site. Go into your WordPress folder, find a folder called “wp-content”. Inside that folder is another folder labeled “themes”. Inside that folder is the folder that contains your theme, the one you’ve been making changes to. Find the stylesheet and download it. (If you’ve made changes to other theme files, you’ll want to download those, as well.)

Now, head over to the WordPress theme repository and download an unaltered copy of your theme. If you bought a theme from a commercial theme developer, you’ll need to check with them about getting a fresh copy.

What you now need is a way to quickly and easily compare your changed files with the unchanged ones you just downloaded. There are at least four sites where you can do this online:

  • DiffNow allows for copying and pasting of text files, or a simple upload.
  • Text Compare! allows for copying and pasting of files.
  • Diff Checker allows for copying and pasting of files.
  • QuickDiff allows for copying and pasting of files.

I don’t use any of those. I prefer WinMerge, which is a program you download and use locally. But all of them will do the trick.

With the tool of your choice, find the difference between the original stylesheet and the one you’ve altered. Copy those changes over to your child theme stylesheet, saving as you go. Once you’ve done that, you can upload your child theme, upload a fresh copy of your original theme, and then select your child theme as the current theme. (Because child themes are, from WordPress’s point of view, different themes, you will need to reset your header and background.)

If you have made changes to the theme’s functions.php file, you’ll want to do the same thing.

Why not just copy the entire stylesheet over to the child theme?

You really want to avoid doing this. For reasons I don’t entirely (yet) understand, this causes a lot of problems. Instead, just copy over those portions that you changed.

For example, if your original theme contained this block of code:

.page-title {
    background: #2070B7;
    color: #e3e3e3;
    font-size: 16px;
    margin: 0 auto 10px;
    padding: 8px 0;
    text-align: center;
    text-shadow: 0 -1px 0 #333;
}

and you changed only the font size property, so that it looks like this:

.page-title {
    background: #2070B7;
    color: #e3e3e3;
    font-size: 24px;
    margin: 0 auto 10px;
    padding: 8px 0;
    text-align: center;
    text-shadow: 0 -1px 0 #333;
}

Then the only thing you should include in your child theme would be this:

.page-title {font-size: 24px;}

What if I’ve edited other files besides the stylesheet?

Then things become a bit more complicated. What you’ll need to is to create copies of those files in your child theme. I don’t have a lot of experience with this, so I don’t want to get into this too deeply, as I don’t want to give you bad advice, and some of this depends on the way your theme is structured. For a start, you could simply copy the files you have altered over to your child theme folder, and you should be okay. But see the resources in the Codex about this first.

 Summary

As you can see, WordPress child themes can be as simple or as complicated as you need them to be. They are not difficult to set up, and can help you learn the basics of HTML, CSS, and even PHP. You may have so much fun with them that you decide to create your own WordPress theme or plugin. Enjoy!


Share this...
1
Share
Except for material released under a Creative Commons License: ©2021 Kenneth John Odle All Rights ReservedPermalink for this article:
https://techblog.kjodle.net/2014/04/12/wordpress-child-themes-the-whys-and-hows/