Home » Create a WordPress Child Theme

Create a theme that inherits the look and feel of the parent theme and all of it’s function. This theme is called a Child Theme.

Customizations will be kept separate from the parent theme’s files, thus, upgrading the parent theme will not affect the customizations made on the site.

In other words, it will be easy to upgrade the parent theme without a need to change anything from the customizations made. This is a common issue when the parent theme is customized, and then when there’s an upgrade with the parent’s theme, customizations will be subjected to update which will make it uneasy for the developers because this might cause conflicts with the updates, or worst, destroying and rewriting of the customizations.

Requirements

  • WordPress

The goal of this tutorial is to create a child of the parent theme twentytwentythree.

Step 1.

Create a new folder for the child theme. This will make sure all customizations are made only inside this new folder.

Inside the themes directory (wp-content/themes), create a new folder and name it twentytwentythree-child.

It is a best practice to name a child theme the same with the parent theme name with -child at the end.

Step 2.

Create the child theme’s own stylesheet.

Inside the new child theme directory (wp-content/themes/twentytwentythree-child), create a new file style.css. This is where all the CSS rules and declarations that control the look of the child theme will be saved.

The CSS file (style.css) of the new child theme must contain the following required header comment at the top of the file.

/*
Theme Name:   Twenty Twenty Three Child
Theme URI:    Your Child Theme URI here
Description:  Twenty Twenty Three Child Theme
Author:       Your Name Here
Author URI:   Your Author URI
Template:     twentytwentythree
Version:      Your Child Theme Version Here
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         You Child Theme Tags Here
Text Domain:  twentytwentythreechild
*/

Where.

  • Theme Name – is required, and needs to be unique.
  • Template – is required, this is the name of the parent theme directory.
  • Other remaining information are not required, just add as you like.

Result.

Inside the new child theme’s folder twentytwentythree-child, the CSS file (style.css) should exist.

 

Notes:

  • The file functions.php may also be created inside the child theme directory for custom functions, like to enqueue styles correctly.
  • If needed, enqueue the parent and child theme stylesheets.
  • You still need to install and activate the new child theme to make the custom look and design adjustments reflect on your website.

References:


Posted

in

by

Tags:

Leave a Reply

Your email address will not be published. Required fields are marked *