At some point in my career as a designer, I kept on seeing the term, Child Theme, and I had absolutely no idea what it was. It wasn’t until much later I figured out that if I needed to go far with WordPress, I needed to familiarize myself with the term asap. So let me teach you how to create a child theme in WordPress.
First, definitions as usual. What is a Child Theme?
A WordPress child theme is a WordPress theme that inherits its functionality from another WordPress theme, the parent theme. Child themes are often used when you want to customize or tweak an existing WordPress theme without losing the ability to upgrade that theme. – WP Beginner.
A child theme is a theme that inherits the functionality and styling of another theme, called the parent theme. Child themes are the recommended way of modifying an existing theme. – WordPress Codex
Why Do I Need To Create A Child Theme?
- If you modify a theme directly and it is updated, then your modifications may be lost. By using a child theme you will ensure that your modifications are preserved.
- Using a child theme can speed up development time.
Let’s get Started. Create A Child Theme for Any Theme. Steps?
A child theme consists of at least one directory (the child theme directory) and two files (style.css and functions.php), which you will need to create.
So, step 1 is to create a new folder for your child theme which will be placed in wp-content/themes. Name it something like /themename-child/. Within your new theme folder, create a file called style.css and fill in the information as outlined below. The theme Name, URI, Description and Author are totally up to you.
Make sure that there are no spaces in your child theme directory name, which may result in errors.
See the screenshot below: (I will use the twentyfifteen theme as an example).
[snippet slug=chdthm1 lang=abap]
so that’s step 1. Next, is to enqueue the parent and child theme stylesheets. The correct method of enqueuing the parent theme stylesheet is to add a wp_enqueue_scripts action and use wp_enqueue_style() in your child theme’s functions.php.
The previous method was to import the parent theme stylesheet using @import: this is no longer best practice, as it increases the amount of time it takes style sheets to load.
Functions.php is where a theme’s main functions are typically stored. A parent theme’s functions are always loaded with the child theme, but if you need to add more custom functions to your theme then you can do so by creating a new functions.php file within your child theme folder.
This is what the code will look like:
[snippet slug=chdthm2 lang=abap]
Finally, activate the child theme. Uploading and activating a child theme is no different than a normal theme, simply upload it via the Appearances > Themes page in your WordPress Dashboard and activate it. Make sure that your parent theme is also uploaded so that the child theme can work.
Note: You may need to re-save your menu (Appearance > Menus) and theme options (including background and header images) after activating the child theme.