How to Create Child-theme in WordPress Step by Step very easy

Video for who doesn’t like to read ;). And if you like the video then subscribe my channel and share this with others who has the same issue.

Step – 1:

Select any theme ( For ex. 2020 ). This will be called a parent theme.

Step – 2:

Create folder for child-theme at ​”wp-content/themes/parent_theme_folder_name-child

The folder name should be as per parent theme.

For ex. if parent theme folder name is twentytwenty, then child theme folder name should be twentytwenty-child.

Step – 3:

Create a stylesheet file(CSS) and give it a name style.css. After that open parent theme’s style.css and copy some lines from that parent theme’s style.css. Those lines will look like as bellow:

/*
Theme Name: Twenty Twenty
Text Domain: twentytwenty
Version: 1.4
Requires at least: 4.7
Requires PHP: 5.2.4
Description: Parent theme description.
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready
Author: the WordPress team
Author URI: https://wordpress.org/
Theme URI: https://wordpress.org/themes/twentytwenty/
*/

Step – 4 ( Important Step ):

Add copied lines from step-3 into child theme’s style.css and add one more line as below into that. This step is the most important step.

Template:     twentytwenty

We added twentytwenty, because in our case parent theme is twentytwenty, which is the folder name of the parent theme. Our final code in style.css will be like as below

/*
Theme Name: Twenty Twenty Child
Text Domain: twentytwentychild
Version: 1.0
Requires at least: 4.7
Requires PHP: 5.2.4
Description: Twenty Twenty Child theme description.
Author: the WordPress team
Author URI: https://wordpress.org/
Theme URI: https://wordpress.org/themes/twentytwenty/
Template: twentytwenty
*/

After doing this, your child theme will start displaying in theme’s page in backend.

Step – 5:

Create a new file and give the name functions.php and add the following code into it:

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {

    $parenthandle = 'twentytwenty-style';
    $theme = wp_get_theme();

    // Include parent theme's style.
    wp_enqueue_style(
        $parenthandle, get_template_directory_uri() . '/style.css',
        array(),
        $theme->parent()->get('Version')
    );

    // Add child-theme's style.
    wp_enqueue_style( 'twentytwenty-child-style', get_stylesheet_uri(),
        array( $parenthandle ),
        $theme->get('Version') // this only works if you have Version in the style header
    );
}
Step – 6 ( Not Necessary ):
 
Add screenshot.png in the child theme folder.
 
 
That’s All!!

Related Articles

Add custom filter for searching post or users in WordPress backend

For this, two parts are important. Part 1: Adding select dropdown Below is the action by which we can add a new search filter for…

The last day ( છેલ્લો દિવસ )

Hi there, The last day, yes I am talking about the last day of the year 2016. Another year passed and I became 26 in…

Fun @ WordCamp Pune

In my previous blog First WordCamp, I covered what we have done in WordCamp. Now in this blog, you will know what fun we did…

Install wp-cli on windows

WP-CLI is a set of command-line tools for managing WordPress installations. You can update plugins, configure multisite installs and much more, without using a web browser.

So I am going to tell you short, simple and easy way that how to use wp-cli on windows system.

First WordCamp

I am going to tell you about my first WordCamp which was held in Pune on 15th Jan 2017. And yes I was very happy…

Responses

Leave a Reply