How to create WordPress child theme?

WordPress Child theme allow you to make lot of changes without affecting the original theme code & functionality, which makes it easy to update your parent theme without deleting your customization. It is the best way to customize WordPress theme. A WordPress child theme receive all the features and appearance of its parent theme. You can customize it without affecting the parent theme. It allows you to easily update all new feature on parent theme without worrying about losing your changes.

Why use a WordPress Child Theme?

There are some reasons why you would like to use a child theme:

• If you convert a theme directly according to your need and it is updated, then your modifications may be lost. By creating a child theme you will ensure that your modifications are safe.
• It can speeding up development time.
• It can help to learn about WordPress theme development.
• If you aren’t satisfied with your changes in your theme, just you need to disable the child theme and all things will be as it was before.

A child theme made up of at least one directory (child theme directory) and two files (style.css & functions.php), which you will necessity to create:

1. Child theme directory
2. style.css
3. functions.php

The first step to creating a wp child theme is to create a directory, which will be put in wp-content/themes. It is recommended to give your theme’s directory the same name as the parent theme and append it with -child. Because we are using the Twenty Seventeen theme, we will name our directory twentyseventeen-child. You will also make sure that there are no spaces in your new directory because that might cause errors.

The next step is to creating stylesheet (style.css) for your new directory. At the beginning of the file write below information:

/*
 Theme Name:     Twenty Seventeen Child Theme
 Theme URI:      http://example.com/blog/twenty-seventeen-child-theme/
 Description:    A child theme for use with WordPress Twenty Seventeen Theme.
 Author:         Example
 Author URI:     http://example.com
 Template:       twentyseventeen
 Version:        1.0.0
*/
 
/* Add Custom CSS after this line */

The final step is to create a functions.php in your directory and paste below code to import the parent themes style.

<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array('parent-style')
    );
}

You can also add a screenshot image file for your child theme.

Installation Method

After you have created your new directory style.css and functions.php file, then you can upload and activate your child theme. Be sure to zip it before uploading.

Appearances > Themes

Step by step video tutorial to create WordPress child theme.