How to Create a WordPress Child Theme

A WordPress child theme inherits the style and configurations from the parent theme and it allows you to extend its functionality by keeping all the modifications separated. The most important benefit is that it will allow you to update your theme without losing any customizations.

In this step-by-step tutorial, we’re going to show you how to create your own WordPress child theme.

Are you ready? Let’s get started!

How to Create a WordPress Child Theme Manually

It only takes a few steps to create a child theme in WordPress. We’ll go over each one in detail below so you can follow along. This tutorial will use the default WordPress theme, “Twenty Twenty-One”.

Step 1: Create the Child Theme Folder

First, you’ll need to create a folder and place it under /wp-content/themes/ in your WordPress installation; This folder will contain all the assets for your child theme. You can name this folder anything you want. For this demo, the name will be “getstartedwp-child”.

Step 2: Create Child Theme Files

Next, we need to create the style.css file. Open a text editor such as Notepad, create a new document and paste the following code on it:

/*
Theme Name: GetStartedWP Child Theme
Theme URI: https://getstartedwp.com/
Description: GetStartedWP Child Theme.
Author: GetStartedWP
Author URI: https://getstartedwp.com/
Template: twentytwentyone
Version: 1.0
*/

This code provides details about the child theme. Feel free to change it to meet your needs. Save this file as style.css in the newly created child theme folder.

The next step is to create a second file that will enqueue, the parent theme’s stylesheets. To do so, open a new text editor document and paste the following code into it:

<?php

if ( !defined( 'ABSPATH' ) ) exit;

/* enqueue scripts and style from parent theme */

function gswp_twentytwentyone_styles() {
    wp_enqueue_style(
		'child-style',
		get_stylesheet_uri(),
    	array( 'twenty-twenty-one-style' ),
		wp_get_theme()->get('Version')
	);
}

add_action( 'wp_enqueue_scripts', 'gswp_twentytwentyone_styles' );

This code works when you use Twenty Twenty-One as the parent theme. However, if you are using a different parent theme, you’d need to update line #7 with the corresponding theme name.

array( 'your-parent-theme-slug' ),

Note: In the past, the common method was to import the parent theme stylesheet using @import inside style.css. We don’t recommend this practice, as it increases the amount of time it takes style sheets to load. Plus it is possible for the parent stylesheet to get loaded twice.

Save this file as functions.php in your child theme folder. This file is where you add more features to your WordPress website and it can be used to hook into WordPress core functions, making your theme more extensible, and functional.

Finally, the last thing you need to create is the screenshot.png file. The recommended image size is 1200px wide by 900px tall. We’ve created a template that you can download and modify: screenshot.png

You can download the child theme folder from our GitHub repository. It contains all of the files described above — simply visit the following link and select the “Download Zip” option.

https://github.com/GetStartedWP/child-theme

How to Create a WordPress Child Theme Using a Plugin

There are multiple plugins to create a child theme, however, we consider Child Theme Configurator to be the most flexible and easier to use. This plugin allows you to create a WordPress child theme without writing any code.

Step 1: Install and Activate the Plugin

The first thing you want to do is install and activate the Child Theme Configurator plugin. You can do this from your WordPress admin area by going to Dashboard → Plugins → Add New.

Step 2: Creating the Child Theme

Once you have installed and activated the plugin, you need to navigate to Tools → Child Themes on your WordPress dashboard.

You’ll see the main configuration page and the options to create your WordPress child theme.

Click on the “Parent/Child” tab and select your parent theme.

Next, click on the “Analyze” button to make sure the theme meets the requirements to be used as a parent theme. Our “Twenty Twenty-Two” theme passed the validation.

Next, you’ll be able to name your child theme and choose where to save your Stylesheet (style.css)

Also you’ll see the default settings already checked, however, if you like to handle your child theme settings in a different way, feel free to make the necessary updates.

In section number 7, click on “Click to Edit Child Theme Attributes” and update your child theme details as needed.

When you create a new child theme, menus, widgets, and other customizer settings are not transferred. Check the option in section 8 if you want to copy these settings from the parent theme to the child theme.

Finally, click on “Create New Child Theme” to run the configurator and create your new child theme files. If your child theme was successfully created a notice will show up at the top of the plugin’s page.

Before activating your new child theme, make sure to click on the preview link to check that everything looks good before you publish it.

If everything is working, click the “Activate & Publish” button at the top to make your child theme live.

That’s it! We hope you found this tutorial useful and that it helped you understand how to create a WordPress child theme using different methods. If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.