Now Zip has added a theme to his WordPress website, he should consider adding a child theme. Here’s how to add a child theme in WordPress using a plugin.
What is a Child Theme?
A child theme in WordPress is a collection of files that refer to a primary (“parent”) WordPress theme but override some of its styles. At base, a child theme includes a styles.css file that contains CSS to customize styles and a functions.php file that can include various PHP snippets that affect the theme and various plugins. These files live in the /wp-content/themes/your-child-theme-name-here/ directory. You can also include subdirectories with templates to override styles in various plugins if you really want to get into customizing your child theme.
The advantage of a child theme is that if you don’t use one and customize your theme’s styles, those changes may well get overwritten when you run an update of the parent theme. This won’t happen if you create a child theme and do customizations with the child theme activated.
Do You Need a Child Theme?
I noticed a client wasn’t using a child theme. This wasn’t the problem I was addressing on here website, but I recommended it to her. “Do I really need one?” she wondered. Did she? She was using her beautiful theme straight out of the box with just about NO customizations whatsoever. As it stood, she did not need a child theme. However, I advised her to create one if she ever wanted to get into making CSS changes to her site.
I always make a child theme because I always end up wanting to mess around with something.
How to Add a Child Theme in WordPress Using Child Theme Configurator
You do not need to use a plugin to make a child theme. However, this is a beginning tutorial. I’ve found the easiest way to configure a child theme without much frustration is by using a plugin.
A number of free plugins exist in the WordPress plugin directory that will help you configure a child theme. We’re going to use a plugin called Child Theme Configurator as its the one I’ve found that works best now. If you choose a different plugin, look at its documentation, and make sure it’s not using @import. That’s not necessarily “bad,” but will lower your score a bit on website optimization scores (which we’ll look at later.)
Approximate Time Needed: 10 minutes.
How to Add a Child Theme in WordPress Using Child Theme Configurator
- Install and activate the Child Theme Configurator plugin.
Search for it in plugins, install, and activate it. If you’re not sure how to install and activate a plugin, read this post.
- Go to the Child Theme Configurator Settings
Once you’ve installed the plugin, you’ll find it under Tools>Child Themes
- Select Create a new Child Theme and Analyze
Select CREATE a new Child theme radio button, select the Parent-Theme for which you want to configure a child theme, and then click Analyze.
- Configure the Following Options:
Choose a name to differentiate your child theme from the parent theme (hyphenated if its multiple words.)
Select where to save the styles (I use the primary stylesheet.)
Use the WordPress style queue.
If its your first time configuring this child theme, SELECT the Copy Menus, Widgets and other Customizer Settings from the Parent Theme to the Child Theme checkbox.
- (Optional) Customize the Child Theme Name, etc.
If you click the Click to Edit Child Theme Attributes button, you’ll see fields where you can change the information in your child theme (i.e. if you want to name yourself as author.)
- Click the Create New Child Theme button.
- Preview Your Child Theme
You’ll see a link at the top of the page after your child theme is configured saying “Child Theme (Child Theme Name) has been generated successfully. IMPORTANT: Preview Your Child Theme Before Activating.
Click the link to preview your child theme on the front end of your website. This will launch the Customizer (which we haven’t got to yet in this series.) You’ll be able to see your website. If it looks like it should, click the Activate and Publish button on the top left.
- Your Child Theme is Activated!
Make sure to preview it on the front end of the website. If you ever need to deactivate it and switch to the parent theme, you can always do that from Appearance>Themes.
Here’s a short video showing the entire sequence, only with a different theme than in the above tutorial.
Do I need to add new CSS directly to the styles.css sheet in my child theme?
Not in my experience. If I add custom CSS to the Advanced CSS tab in the configurator, those styles are saved even with parent theme updates.
Do I need to keep Child Theme Configurator installed and active once I’ve customized the child theme?
No. After you’ve configured your child theme, deactivating or uninstalling the plugin will not disable or harm your child theme.
Onward!
Child theme installed!
Next, let’s talk about that link at thetop of Zip’s theme which implores him to install the Elementor pagebuilder.
