How to create a child theme in WordPress - step by step

What is WordPress Child Theme?

A child theme is a separate theme but use the parent theme’s properties, functionalities, and layout. We make all the changes in the child theme so that when updating parent themes, the child theme is not affected by the updates and our changes stay intact.

Why do we need a child theme?

First of all, we need to understand – Why do we need a child theme?

Well, there are quite strong reasons for doing this.

Themes you are using or want to use release updates over the period of time. If you customize your main theme, that will be overwritten when you update. So all the changes and customization will be lost.

Here comes the child theme to save your efforts you put in the customization.!

How to create a child theme in WordPress?

Creating child theme in WordPress is easy!

Just follow the steps below:-

Step 1-

Navigate to wp-content/themes/ and create a child theme directory there . e.g. :- twentyfifteen-child-theme.

Step 2-

Create style.css and functions.php in your newly created child theme (twentyfifteen-child-theme) directory. 

Step 3-

Copy the below code and paste it into - style.css Your Stylesheet should look like this:-

/*
 Theme Name: Twenty Fifteen Child
 Theme URI: http://example.com/twenty-fifteen-child/
 Description: Twenty Fifteen Child Theme
 Author: John Doe
 Author URI: http://example.com
 Template: twentyfifteen
 Version: 1.0.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain: twenty-fifteen-child
*/
/*--    Customization    --*/

• In the “Theme Name:” goes your child theme name. Here it is “Twenty Fifteen Child”.
• “Theme URI”, “Description”, “Author”, “Author URI”, “Version”, “License”, “License URI”, “Tags” and “Text Domain” are not necessary, but simply provide additional information about the child theme.
• “Template” is your parent theme name and is case sensitive. It will be same as your parent theme folder name. For example, if you are creating a child theme for "Twenty Fifteen" theme then template name will be - twentyfifteen

Step 4-

In “functions.php” file of the WordPress child theme, paste the following code -

add_action( 'wp_enqueue_scripts', 'enqueue_child_theme_styles', PHP_INT_MAX);
function enqueue_child_theme_styles() {
 wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
 wp_enqueue_style( 'child-style', get_stylesheet_uri(), array('parent-style') );
}

That’s all!.

Now go to Appearance -> Themes in WordPress admin left menu.

If everything goes OK then your new child theme will appear. Activate it.

Now you can easily customize the look and feel of your theme.

Start writing CSS in style.css of the child theme. You can easily find and override your theme's selectors by inspecting elements using browser inspector.

Important to know 

• A blank child theme inherits all the functionalities, layout and style from its parent theme.
• The child theme will work only when its parent theme is available. The absence of the parent theme may cause "Broken theme" error.
• If the child theme is having an issue, we can always switch back to the parent theme.

We can optimize and enhance functionalities of WordPress child theme using these useful WordPress functions.

Leave a comment