How to Create a WordPress Child Theme

You’ve been running your WordPress site or an e-commerce site for a while and it’s been doing fine and meeting your requirements. But now, you need some customization or need to override some functionality of your parent theme. Its the best practice to use a child theme.

What is a child theme in WordPress?

A child theme is a sub-theme that inherits the look, feel, and functions of the parent theme. It contains some specific instructions to tell WordPress that this is a child theme and what the parent theme is. WordPress then uses the code from the parent theme in most instances but will override this with code from the child theme (if necessary).

When To Use a Child Theme in WordPress?

A child theme extends the functionality of its parent theme, you can use a child theme to override the template files or functions in your parent theme.

The use case can be, 

• Override one or more functions from the parent theme.
• Edit one or more of the template files.
• Add extra functions that are related to display and not functionality.

How to Create a Child Theme in WordPress

First, you need to open /wp-content/themes/ in your WordPress installation folder and create a new folder for your child theme. You can name this folder anything you want like we are naming it storefront-child.

Every WordPress child theme must have two files as a minimum: a stylesheet and a functions file. 

In the folder for your child theme (storefront-child), create a file called style.css. Open the file with any editor (VS code/Notepad), add the following code,

/*
Theme Name: Storefront-child
Theme URI: https://blogwc.com
Description: Child theme for the Storefront theme.
Author: BlogWC
Text domain: storefront-child
Template: storefront
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

This code contains information about the child theme, so feel free to change it to meet your needs. Now save this file as style.css in the child theme folder you just created. This is your child theme’s main stylesheet.

The next thing you need to do is create a second file that will import, or enqueue, the stylesheets from the parent theme. To do that, create a new document in your text editor and copy the following code.

<?php

add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );

function enqueue_parent_styles() {

wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );

}

?>

You’ve now created a very basic child theme, and when you navigate to Appearance » Themes you should see the Storefront Child Theme. You’ll need to click the Activate button to start using the child theme on your site.

Creating a Child Theme Using a Plugin

Child Theme Configurator is an easy-to-use WordPress plugin that lets you create and customize child themes quickly without using code.

How to Add Functions to Your WordPress Child Theme

Usually, a child theme is created for a specific purpose like,  to add extra functionality or override one or more of the functions in the parent theme.

If you want to add a new function that doesn’t interact with any of the functions in your parent theme, you can just go ahead and do that. Just add the function to the functions.php file in your child theme, hook it to the relevant action or filter hook, and you’re good to go.