What are Child Themes For WordPress (And How to Use Them)

wordpress-child-themeWordPress is known for its themes , which provide a simple and easy way to provide your site with structure and style. That being said, advanced users want customization options. Plugins can do some of the features, but they can’t provide everything. This is where the need for child themes comes into play.

Today, we’re going to look at the form and function of child themes on WordPress, and how you can start using them to further customize and enhance your themes.

What is a Child Theme and Why Would I Need One?

If you want to make modifications to a theme on WordPress, you use a child theme. The main theme on your WordPress site is known as the “parent.” If you, or a customer of yours wants a professional website design, but they also want something changed that involves modifying the source files, you can do this through a child theme.

Child themes themselves are simply blank templates that you can build and mold to your liking. The child theme inherits the functionality and looks of the parent theme, but gives you the option to modifying it without touching the parent theme.

So now we come to the big question:

Why create a child theme when I could just modify the parent instead?

Here are three great reasons:

1. Easy Updating

When you modify your WordPress installation, or your theme, those changes aren’t permanent. When you go to update WP, you lose all of these if you modified the theme or program directly. This happens because of the way WordPress updates.

When you download the latest version, the new files overwrite the old ones, so you can say goodbye to your changes. This problem disappears with a child theme, though. When you update your parent theme, the child theme is left alone, along with all of your coding and modifications.

2. Easy Change Tracking

A single WordPress theme is composed of all manner of files. You’ve got PHP, HTML, CSS, JavaScript, images, and more. It’s a lot to keep track of, especially when you start modifying things.

If you’re working in the parent theme and you make a few changes to the HTML and CSS, but not the JavaScript, hopefully you wrote that down, because there’s no way to track your changes. Now, imagine you have someone else on your team making changes to the parent theme, and suddenly things get messy and disorganized pretty quickly.

Child themes to the rescue! Whenever you make changes to a child theme, you can find them conveniently stored in the child theme’s folder.

3. Easy to Undo

Working directly with source code can be a dangerous business. It’s really easy to slip up and break the entire website or blog if you don’t know what you’re doing. It’s still remarkably easy to do when you do know what you’re doing as well.

In many cases (but not all of them) the problem stems from the last few lines you modified, but it’s hard to tell. In situations like this, you have to go through every single line you modified and try to pinpoint the issue. It’s exhausting.

With a child theme, all you have to do is delete the files that are causing problems, and your website will be back to normal.

How to Implement and Utilize Child Themes

From the user’s side of things, child themes are just as easy to implement as any parent theme. Simply go to appearance -> themes to see all of your installed themes (including the children). Click your child theme and set it to active to implement the new version.

Once you have it activated, you can do everything you would normally want to do. Add widgets, customize your sidebar, create menus, go crazy. If you take a stroll into the theme directory, you’ll see that it’s quite simple.

Just two files to begin with in many cases. An image, and your required css file. The latter file is just the reference to the parent file, so you don’t need to worry about it. The rest is open to your customization.

You have a blank canvas, ready for you to start building. They’re easy to implement, but how do you build one? Let’s find out!

Building a Child Theme For WordPress

The only file you’ll need for a child theme is the style.css sheet. This main file is used to provide the information WordPress needs to recognize the parent of the child theme and how to display it. This is labeled in the actual shee as the “template.” it looks like this:

@import url(“.../parent-theme/style.css”);

The other reason for the style.css file, is to create the style of the child theme itself. It’s recommended that you keep the import rule above within the file so you load the original style sheet along with this new one.

Once you do this, you can create new entries in the child theme or override the old ones. Beyond the stylesheet, you can have anything else you’d like in your child theme folder. Functions.php, templates, graphics, images, the list goes on and on.

You won’t need an import rule for your functions.php file, it’s loaded right before the parent’s own version. You can use this file like you normally would to add new features, security options, and anything else you’re looking to incorporate.

Keep in mind, that if you create new template files for your child theme, they will override the parent theme in this case. You can also add complete new files or custom page templates.

Final Thoughts

Child themes are a simple concept, but they offer an amazing level of customization options for your themes. Even better, they can be used without causing any issues to the parent theme. Now that you have a grasp on what they are, and how to build them, how do you plan on implementing child themes? Let us know in the comments!

Author Bio: Carrie Davidson is a seasoned blogger who has helped launch numerous blogs in her online career. She is an expert in crafting excellent posts with great content and powerful headlines. You can find her online @carriedavidons1

Comment

  1. Shubham Pathak
    June 25, 2017 at 6:48 am Reply

    i was looking for this kind of blog from a long really appriciate!

Leave a Reply

Your email address will not be published. Required fields are marked *