Beginner site builders may question why WordPress child themes are important. Others know but are unsure how to create one from within Dashboard. This guide breaks the child themes role and creation down in plain English, and it all starts with the parent.
What is a WordPress Parent Theme?
You can’t have a child theme without a parent or a parent without a child. In WordPress, the parent theme—or theme framework—refers to the master template. It’s the one that includes all the vital files and style elements needed to function.
What Is a WordPress Child Theme Template?
Child themes are exact copies of the parent template, including code and layout. They exist so that site builders can modify any part without affecting the master copy. That’s why a lot of websites use custom child themes built on the framework of the parent. Thus, custom child themes work within the parent but with no disruption to the original theme files.
Updates with confidence
Sometimes, the author of a WP theme may launch a new version. Today, you can safely update it without fear as all customisations are saved in the child, not the parent. There could be conflicts, though, if you tried to update a modified parent theme. Indeed, back in the bad old days—before child themes existed—customisations were often lost after an update.
When to Use a Child Theme
Try not to create a child theme for the sake of it. It’s an approach best suited for those who perform lots of tweaks to their project. A custom site under construction, for example, might need continual modifications to its functions.php file. It may also require ongoing changes to style.css files. Child themes are ideal for cases such as this.
WordPress Theme Vs. Theme Framework
You can consider any WP theme as a parent, but that doesn’t make them all frameworks. A framework is a kind of versatile theme toolkit. It accommodates all the essential design elements and features. Web developers and designers prefer frameworks as the foundation to build custom themes. Many regular type WP themes are locked and therefore harder to manipulate.
Creating a child for a regular theme (not a framework) lacks flexibility. That can result in more work and code changes. Thus, child themes work better with theme frameworks. In fact, they’re made for each other. Using a framework reduces development time by a significant amount. Equally as important is that they make switching themes much more straightforward.
How to Implement a Child Theme in WordPress
Now it’s time to create a child theme in WordPress. For this tutorial, we use the popular open source Genesis Framework by StudioPress. It’s an excellent choice for this example as it lets us put other themes on top of it, hence the name, framework. For the child theme, we use Academy Pro. There are many choices available, so you’re not restricted to the sample here.
Both the Genesis framework and Academy Pro are premium products. That means they have a price tag, but it’s well worth the extra for those who want a professional website or blog.
Installing the Genesis Framework
The files for premium themes must be purchased then downloaded from the company website. It’s then a simple case of uploading those files directly to WordPress, so let’s get started.
Point to note: You can also upload the new theme folder via an FTP client. The path is typically your public_html web root directory, wp-content/themes folder.
Log in to your WordPress Dashboard.
Go to Appearance then select Themes.
Click on Add New at the top of the Themes screen.
Now click on the Upload Theme button from the Add Themes screen.
Our theme is in zipped format, so we now have the option to upload it. Click Choose File.
The install button becomes active once the zipped folder is selected. Click Install Now.
This process typically takes a few seconds. The progress/update screen looks like this.
Click the Return to Themes Page link.
The Genesis framework is now installed and ready to use. We don’t want to build on it as we’re adding another theme on top. In this case, it’s the Academy Pro child theme.
Repeat the installation steps above to install the child theme then click the Return to Themes Page link. We can now see both the Genesis framework and the Academy Pro theme.
There are three options presented when you hover the mouse over any theme product:
- Theme details
- Live preview
Here’s how that looks when we move the mouse pointer over the Academy Pro theme.
Click on Theme Details (centre). The details page tells us this is a child theme of Genesis.
Click the Activate button from the bottom of the details screen.
The page then returns to the Themes screen.
Point to note: Child themes need a parent. Academy Pro here is the child, and its parent is the Genesis framework. Self-hosting WordPress can only have one theme active at a time. Thus, you DO NOT need to activate Genesis as well; it only has to be installed to support the child.
Click the Visit Site link to the right of ‘New Theme Activated’ confirmation text.
Here’s how our sample site looks.
You now have unlimited customisation potential for this theme from within the WP Dashboard.
Go to Appearance from the Dashboard menu, then click Themes.
Click the Customise button for Academy Pro.
The next screen opens the site on the right side, which allows quick edits (pencil icons). All the main customisation options are in the left column. Take time to explore each of these settings to see what they offer. Customisations are easy to do—and undo—even at the beginner level.
Child Themes and Plugins
It’s also possible to create child themes using a plugin like Childify Me. We don’t need a plugin for Academy Pro, as it’s already a child of the Genesis framework. So, for this example, let’s reactivate the free Twenty Twenty theme from the Themes screen in WP Dashboard.
Next, go to Plugins from the Dashboard side menu and select Add New.
Type Childify Me into the plugins search box.
The Childify Me plugin should now appear in the Add Plugins screen.
Click Install Now. It then changes to a blue Activate button. Click that to activate the plugin.
Now go back to Appearance è Themes.
Click the Customise button for the Twenty Twenty theme.
The next page shows customisation options on the left and the site to the right.
Scroll to the bottom of the theme’s customisation column and click the Childify Me button.
Enter an appropriate name for the child theme in the text box then click Create.
The following confirmation message appears. Click the Preview and Activate button.
The next screen confirms the successful creation of the new child theme. You’re now free to customise it without affecting the Twenty Twenty parent template.
Click the Activate & Publish button once you’ve made your changes.
You now know exactly how to install and activate a premium child theme to the Genesis framework. You also know how to create a child theme to any free WordPress template using a basic plugin. The first approach gives more options and flexibility. The second offers an excellent alternative for those building a content-rich site on a tight budget.