How To Create Your First Child Theme In WordPress

We are often approached by clients that already did their research for their website project and found a WordPress theme that they like, but that would need a bit of customization to perfectly fit their needs.

As you already know if you are familiar with WordPress, a theme is the template that is used to render your website’s look-and-feel. There are plenty of themes available for free on the WordPress.org theme directory, but also some premium ones that come with a price. In the case of premium themes, they are always built by agencies and ensure that your website will look professional. However, they may not fit your needs 100% in terms of design and functionalities.

Luckily, WordPress offers you the possibility to create child themes, which were built just for that purpose.

What are WordPress child themes and why you should use them?

A child theme is a sub-theme that will inherit all the functionalities and looks of a parent theme (aka a regular theme). This allows you to make changes to the visual appearance or functionalities of you website, while leaving the parent theme untouched, because all the changes are kept separate in the child theme files.

The main benefit of creating a child theme is that it will greatly improve the maintainability of your website. In fact, changes made to your child theme will not be affected by the updates you do on the parent theme. Being able to do all updates of your theme quickly is important, as it makes your website more secure and it gives you access to all the new functionalities that come with the theme.

How to create a WordPress child theme?

WARNING: this section assumes that you are already comfortable with the structure of your WordPress site, themes in particular, and that you know how to use FTP or SSH to create, delete, and update directories in WordPress.

Creating a child theme in WordPress is quite straightforward. It only takes the following steps:

Step 1 – Create the child theme folder

Inside your WordPress installation’s theme directory, create the child theme folder as you would for a regular theme.

Step 2 – Create your child theme’s stylesheet

To detect your theme, WordPress uses the stylesheet’s headers. You should create a stylesheet named style.css (it will not work if you name it otherwise) and include the required headers in it. The headers of the stylesheet should look like something like this:

/*
Theme Name: Twenty Twenty-Two Child theme
Template: twentytwentytwo
Author URI: https://wordpress.org/
Description: Built on a solidly designed foundation, Twenty Twenty-Two...
*/

The important parts are highlighted in bold above, they are the theme name (child theme’s name) and the template (parent theme name).

Step 3 – Enqueue the stylesheets

This little bit of code is added to your child theme’s functions.php file to ensure that the styles of both the parent and child theme are loaded, and that they are loaded in the right order.

<?php

add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

?>

Step 4 – Activate the theme

Once all these things are done, you are ready to install your theme and activate it.

How to work with your child theme?

Once you are ready and that your child theme is installed, you can start working on it. This will obvioulsy require some development skills. In short, you will be able to change most of the colors and visual elements by customizing the styles in the stylesheet, while the more functional changes will happen in the functions.php file.

Was this post helpful?
Buy us a coffee!