Marketing & Advertising Magazine

Child Themes in WordPress – How and Why Use Them

Posted on the 09 November 2022 by Jitendra Vaswani @JitendraBlogger

Convenience and user-friendliness have turned into some of the major concerns of modern web design. Of course, we speak about the convenience of an end user that is browsing a website but not only about it. The convenience of the website owner or a person that is customizing a website is also worth fighting for.

However, not all the thighs in web design are pretty obvious. There are such developments that may seem rather pointless from the first sight but are actually tremendously beneficial to a website owner if you dig into them.

Child themes are among such inventions. Having WordPress engine files, parent theme and a child theme may seem useless to a newbie, who is intuitively seeking simplicity. What's the point to make it all so complicated? Actually, the reason is to make the things more convenient and let you, the person modifying the website, escape the pitfalls that experienced web developers are well aware of.

In this article, I'll investigate the question what child themes in WordPress are and how and why you should use them. I guess this would be a pretty insightful journey that will illuminate some of the web design mysteries to you. Let's go!

What is a child theme?

If there is a child, there is (or was) a parent. That's true not only in the human world but also in the world of WordPress themes. Specialists create a child theme in order to inherit the functionality and look of a parent theme. At the same time, with a child theme, you can modify and add functionality to the theme you use, without modifying its vital core files. The parent theme does not undergo any changes.

Many modern template providers use child themes to provide you with templates of extended functionality. For extra theme power, their parent themes are more than packs of design files, they are frameworks, filled with functional advances. For instance, TemplateMonster, one of the leading template providers on the market, uses feature-rich CherryFramework as the parent theme of their WordPress themes. In this case, the child theme becomes the place, where all the unique theme styles are stored apart from other styles and you can easily find them. This scheme is used by many template providers and makes a child theme a crucial part of a template.

The structure of a child theme is, as a rule, pretty simple. Its folder contains only the files you might ever want to modify. The parent theme contains the same files as well. Why might it ever be convenient to actually have files with the same functions on your website? Let's see:

Reasons To Use a Child Theme

If you're planning to customize a website template in any way to adapt it to the needs of your website, there are three major reasons why you need a child theme.

Don't Lose Your Progress: Trouble-free Updates

I bet you're aware that you need to update your website components to keep them glitch and bug-free and to provide for the maximum security of your website. However, the system of WordPress updates is pretty straightforward. Once you make an update, you are able to replace old files with the new ones and WordPress doesn't care whether you've modified the files in the theme of the older version and want to preserve these modifications.

Here comes the child theme. It becomes the place, where all the parent theme modifications are stored. As the files of the child theme override or complement the parent theme files, they let you save and immediately apply all your custom modifications to the new version of the parent theme.

This practice saves you a lot of time, as otherwise, you would have to track down the modified pieces of code in the older version of the theme, copy them to your PC (minding what file each code string belongs to), and then paste them to the corresponding files of the new theme version.

That's why a child theme is in some way your true savior if you want to keep your website up-to-date without extra turmoil.

Modify Your Theme Even Simpler

Parent theme has a rich set of files, and you are not supposed to ever touch some of them. The structure of a child theme is way simpler and includes only the files that are meant to be changed when needed. That's why, a child theme lets you figure out quickly what file you should work with, and lets you faster track down the pieces of code that you've modified earlier.

For example, let's say you want to change some color in your theme. You may look for a specific rule in the style.css file of the parent theme (which is a pretty large one), or you may simply add a new rule (3 or 4 lines of code) to the style.css file of the child theme. The added rule will override the initial rule in the parent theme, no matter, where this rule resides in the style.css of the parent theme.

Let's take another example. If you want to significantly change the structure of your page.php and preserve the older version of the file, you can simply add a new page.php file to your child theme. You will use it in your theme instead of the default one. Whenever you feel like going back to the default structure of this file, simply remove the page.php file from your child folder.

Go Back-And-Forth with Changes

It often happens that you may want to come back to your earlier website modifications to tweak or discard them. If the changes were carried out within the parent theme files, this may be rather problematic as the parent theme contains many files, and it's hard to find the place that you've modified.

With a child theme, it's hard to get lost, as you'll see only what you've modified there. Finding the needed rule among 30 CSS rules is definitely simpler, than locating it within a stylesheet that has hundreds of rules. I guess you got it, don't you?

So, now you know the reasons behind using child themes. They are the ones that are not that obvious for someone, who never created a WordPress website before. However, once you go for creating a website at least once, you'll immediately grasp, how important preservation of your effort and customization convenience that child themes give are.

Using a Child Theme

If you install a modern WordPress template, you'll typically install a parent theme first, and then a child theme. Then, you need to activate the child theme in the Appearance -> Themes section of your WordPress dashboard. Once you do this, your customization assistant, i.e. your child theme, is ready to help you with the implementation of any needed parent theme modifications.

Changing Theme Styles with A Child Theme

Style.css is one of the main and the only mandatory file of a child theme. To work properly and not to discard all the rules that the parent theme contains, this file should include one magic line in its header. This line is:

With this line, all the rules that parent theme contains are applied to your website unless this or that rule is overridden in the body of child theme's style.css. Actually, what you need to is to simply add css rules to the bottom of the style.css file of your child theme, and, believe me, this is not rocket science. Check out this video-tutorial to learn how to customize your template's color scheme with the help of a child theme:

Adding New Functions to Your Theme

With a child theme, you get the opportunity to add all the new theme functions to the functions.php file of your child theme. However, there is one trick that you should be aware of. Unlike CSS rules in style.css of the child theme, functions in functions.php of the child theme do not simply override the analogous ones in the parent theme. Actually, the functions.php file of the child theme loads before its counterpart in the parent theme.

That's why in order to override the function in the functions.php file of the parent theme you should use the following conditional statement:

These green lines of php code will make the browser check, whether the function that is interesting for you exists in the parental functions.php file. Then, it's up to you what php command to use to modify the existing rule.

Adding New Files to Your Theme

It is important to say that a child theme is a place of your freedom. You can add any files you need and override the files of the parent theme with them. style.css and functions.php are the only two files of the child theme that do not discard the corresponding files of the parent theme completely.

All the other files of the child theme will override the analogous files of the parent theme. Feel free to create new versions of such files as single.php, index.php, page.php, 404.php, etc., use them and never fear to lose the default theme files as they remain intact within your parent theme folder.

Conclusions

The child theme is a very smart and simple solution that lets you work upon creation of your website more efficiently and never fear to lose your progress. With child themes, you can customize your theme styles, modify its functions and apply modifications to other theme files without losing a chance to come back to initial file version whenever needed. So, never think of a child theme as of an albatross around your neck: use it wise and it does you a lot of favors.

Now, it's your time to speak up! If you have any questions or considerations, feel free to share them in the Comments section below.

Take care!


Back to Featured Articles on Logo Paperblog