How to Effectively Create a WordPress Child Theme

If you are a newbie in WordPress or in the development phase, you probably already know the basics about WordPress Child Theme. Needless to say, child theme possesses the DNA of the Parent theme. For instance, if you want to do the modifications and make a few changes in your Current WordPress Theme, then it is highly recommended to create a WordPress Child Theme. In this tutorial, we will learn how to Create a WordPress Child Theme without any hassle.


Why Child Theme?

According to a recent WordPress Survey, 85% of the users Customize their WordPress theme no matter how elegant the theme is and only 35% uses Child Theme to make changes. So why so few numbers use Child Theme in general? It may be due to lack of understanding or because of the perceived difficulty in creating one. Or may be they are just bored.

The reasons for using Child Theme:

  • If you use a child theme and make changes in it, your changes will remain forever even if you update Parent Theme. However, if you modify your parent theme directly, then all the changes will revert back to the default after the update. That means the changes you made gets lost after theme’s update when you are not using the Child Theme.
  • Child Theme speeds up the development.
  • A Child Theme is a good way to learn about Theme Development.
  • Your original Theme won’t get affected even if you mess around the codes in your Child Theme.
  • Can easily track the changes you made and can revert back to original any time.
ALSO READ  How to Migrate WordPress site to another URL

How To Create a WordPress Child Theme?

To demonstrate, we will be creating a child theme for a default WordPress TwentySeventeen Theme. Follow the below steps precisely in order to get started:

  • The very first thing you need to do is Create a New Folder and rename it to something like TwentySeventeen-Child. This will be inside your /Themes folder.
    Create a WordPress Child Theme
  • Inside your new folder, create a new file style.css.

    Note: For creating Child Theme, style.css alone is enough. No other files needed to create a template.

  • Fill the information required as outlined below in your style.css. You can name the Theme Name, Theme URI, Description, and Author as your choice. Entirely up to you.
    /*
    Theme Name: Twenty Seventeen Child Theme
    Theme URI: http://wordpress.org
    Description: Child theme for TwentySeventeen
    Author: Prabin
    Author URI: http://prabinparajuli.com.np
    Template: twentyseventeen
    */
    
    @import url("../twentyseventeen/style.css");

Now, we have successfully created the Child Theme for TwentySeventeen Theme. We should keep in mind that while creating child theme, Template and @import url are the most important parts. You can see in the above code too we have written both lines of code. They are the ones that identify the parent template and parent theme. Template identifies your parent Template twentyseventeen (which is a folder name of the theme).

Also remember, if you are going to create a Child Theme for another theme, make sure you correctly change the template name (that is theme folder name). Everything is Case Sensitive! The folder name of the parent theme is twentyseventeen. So you CANNOT use Twentyseventeen (with capital T) in your Template section if it’s folder name starts with small t. Same goes with @import url.


Activating Twenty Seventeen Child Theme

If you have followed the above steps precisely, you have officially created a Child Theme. Login to your Dashboard. Go to Appearances—>Themes. You will see the new theme appearing, which is the child theme, on the lists. If you activate it and view your website, you will see the website appearing the same way as your previous parent theme.

ALSO READ  How To Create a New Admin Account in WordPress Via Mysql

Now, add some stylesheet to your style.css and view your website. You’ll see the Magic !!

Comment in the form below if you have any problem creating a Child Theme. If this simple tutorial helped you, hit the Share button below.

Happy Child Theme !!