A WordPress Child theme is a theme that inherits the functionality of its parent theme and allows you to customise the layout, colours and add additional functionality. This allows you to update the parent theme as and when released by the theme developer without the risk of overwriting your customisation.
How to create a Child Theme
There are two ways to create a child theme for your WordPress website.
- Manually creating the required directories and files (Our recommended option)
- Using a plugin
Method #1: Manually creating a Child Theme
Using your favourite FTP client for example FileZilla, navigate to /wp-content/themes/ in your WordPress installation folder.
Now create a new directory. This can be called anything you want but it is good practice to it the same as the parent theme with “-child” appended to it.
So for example, if you are using the Divi theme created by Elegant Themes, your new child theme directory would be divi-child.
Now you need to create a file called style.css and add the following lines of code.
/* Theme Name: Divi Child Theme URL: https://example.com Description: Child theme for the Divi theme Author: Your name Author URL: https://example.com/about Template: divi Version: 1.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: light, two-columns, right-sidebar, responsive-layout, accessibility-ready Text Domain: divichild */
The following information is required:
- Theme Name – needs to be unique to your theme
- Template – the name of the parent theme directory. The parent theme in our example is the Divi theme, so the Template will be divi.
Add remaining information as applicable. The only required child theme file is style.css, but functions.php is necessary to enqueue styles correctly, we will cover this next.
Now we need to enqueue the parent and child theme stylesheets.
In the past, the common method was to import the parent theme stylesheet using @import inside style.css. This is no longer the recommended practice, as it increases the amount of time it takes for style sheets to load.
To do this create a new file using your text editor and add the following code:
<?php // Opening PHP tag - nothing should be before this, not even whitespace
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'child-style', get_stylesheet_uri(),
array( 'parenthandle' ),
wp_get_theme()->get('Version') // this only works if you have Version in the style header
);
}
Now save this file as functions.php in your child theme folder.
Most of the time people overlook creating a Child Theme Screenshot, but this is again very simple to do and adds that little bit extra to your child theme.
Using your favourite graphic design app, we love using Canva, create an image 1200 x 900 px and save it as either screenshot.png or screenshot.jpg.
Method #2: Creating a Child Theme using a Plugin
Not feeling confident to use FTP and create the files manually, don’t worry there are plenty of plugins in the official WordPress plugin repository that you can install and use to create your new child theme.
Child Theme Configurator is one of the most popular child theme creator plugins and is super easy to use, with no coding required.
