What is a child theme and why do you need it?
A child theme can be used to customize your original WordPress theme (parent theme). You may use it for minor CSS customizations on your website as well as for larger theme customizations. The good thing about using a child theme is, that after you have customized your theme, changes will remain after a theme update. That of course doesn’t mean that your customizations always will be compatible with the latest version of the parent theme, but at least your changes are not lost so that you can modify them as you like in case it is necessary.
As soon as you start customizing your original WordPress theme (parent theme) directly – without using a child theme, you can be sure that all your changes are gone after a theme update. To avoid this, using a child theme for theme customizations is highly recommended.
In case you’re planning to customize your website – especially for larger theme customizations – we recommend you to use a child theme. The child theme will then inherit the functionality and styling of your original WordPress theme (parent theme).
How to create a child theme?
Note: In case you have purchased one of our premium WordPress themes, you have an applicable and ready-to-go child theme zip (e.g. mh_squared_child.zip) included in the add-ons folder within your WordPress theme folder which you can use to apply your customizations.
If you are using a WordPress theme that hasn’t already included child theme files, you can follow these few steps to create your own custom child theme for your WordPress theme:
A. First you have to create a child theme folder (e.g. mh_squared_child) that will contain the files for your custom child theme.
B. Second – a child theme must consist of at least two files: style.css and functions.php. Create these two files by following the instructions below and place them inside your new child theme folder.
C. Upload and install the child theme through your WordPress dashboard. After you’ve activated the theme, the customizations which you’ve implemented in the child theme will be applied to your website.
1st file – The style.css needs a stylesheet header
The style.css file needs a stylesheet header as seen in the code below. If you create the style.css file you will have to replace the necessary data below very carefully with your own data. Be sure that you also name the “Template” line correctly as this will refer to your parent theme’s directory/folder name. In case you are using one of our WordPress themes, then you are lucky as we have already taken care of the stylesheet header for you.
/***** Theme Name: MH Squared Child Theme Theme URI: https://mhthemes.com/themes/mh-squared/ Description: This is a child theme for MH Squared WordPress theme to make customizations much easier for you. By using this child theme you make sure, that you keep your changes after an update of the parent theme. Author: MH Themes Author URI: https://mhthemes.com/ Template: mh_squared Version: 1.0.0 License: GNU General Public License v2.0 License URI: https://www.gnu.org/licenses/gpl-2.0.html *****/
2nd file – The functions.php needs enqueuing instructions
The functions.php file is needed to enqueue the stylesheets accordingly. There are several ways to enqueue the parent and child theme stylesheets, depending on how many stylesheets your parent theme contains. Please see the code below for more info on the content of functions.php. If you are unsure how to enqueue your scripts, the WordPress Codex might help you.
/***** Load Stylesheets *****/
function mh_squared_child_styles() {
wp_enqueue_style('mh-squared-parent-style', get_template_directory_uri() . '/style.css');
wp_enqueue_style('mh-squared-child-style', get_stylesheet_directory_uri() . '/style.css', array('mh-squared-parent-style'));
}
add_action('wp_enqueue_scripts', 'mh_squared_child_styles');
Other files inside your child theme
Dependent on what you plan to customize, you will have to put other files inside your child theme folder as well. Let’s say you want to customize your footer. Then you will need to duplicate the footer.php of your WordPress parent theme and put a copy inside your child theme folder to customize it. This applies to other files you want to customize as well, be it a template, the header or anything else. The child theme will always override the files of the parent theme with its own files.
Important: Please notice that the copy, paste & customize approach of files within a child theme usually only works for template files like for example header.php, footer.php or index.php. When it comes to PHP functions, that usually requires additional work and it always depends on if the functions are pluggable, if the functionality is added by using hooks or filters or else.
How to upload, install and activate the child theme?
If you are ready to go – having created a child theme with at least two files (style.css and functions.php) and maybe other customized files – you can now upload, install and activate your child theme through your WordPress dashboard under Appearance => Themes. After installing the child theme it will be listed in your themes overview.
After theme activation, your child theme will now refer to the parent theme and override parent theme files with customized child theme files and these customizations won’t be lost anymore after theme updates of the parent theme. Please keep in mind that the parent theme always must be installed (but not activated), otherwise your child theme will stop working. For more information on using a child theme, please also see this comprehensive guide on child themes.