How To Create Child Theme in WordPress
The very first thing you need to do before customizing your WordPress Theme is to create a WordPress Child Theme. And the very first thing you need to know during the development phase is learn how to create about WordPress Child Theme. Simply saying, a child theme possesses the DNA of the parent theme. By the way of illustration, if you want to modify and make some changes in your current theme, it is better to create Child Theme in WordPress. And we will learn how to effectively do it in this tutorial.
Why WordPress Child Theme?
Before creating a child theme, you need to first understand why you are doing it. Why you need it? We will explain in brief.
The reasons for using Child Theme:
- Creating child theme prevent the loss of updates/modification when your parent theme gets updated. When you modify your parent theme files, all the changes will be back to the previous settings once your theme gets updated. All the changes will be lost.
- Creating child theme speeds up the ease of development.
- It is a great way to learn about theme development and WordPress hierarchy.
- You can always revert the previous settings even if you mess around the codes in the Child theme.
- It shows the professionalism.
How To Create WordPress Child Theme?
To illustrate, we will create a Child theme from our default WordPress theme TwentySeventeen. Meaning TwentySeventeen will be our parent theme. Below are the steps:
Step #1: The very first thing you need to do is Create a New Folder inside your theme directory and rename it to something like TwentySeventeen-Child.
Step #2: Inside your newly created folder. Create style.css file.
Step #3: Now open your style.css file and update the file with below code:
/* Theme Name: Twenty Seventeen Child Theme Theme URI: http://wordpress.org Description: Child theme for TwentySeventeen Author: WpSquash Author URI: http://wpsquash.com. Template: twentyseventeen */ @import url("../twentyseventeen/style.css");
You’ve now successfully created the child theme for TwentySeventeen. You should know while creating a child theme, three keywords are very important. Theme Name, Template, and @import url.
In the code above, Template: twentyseventeen represents the parent folder name. It is case-sensitive, so make sure you type the correct spelling there. And the code
@import url("../twentyseventeen /style.css");,
imports all the stylesheets from the parent theme.
It’s pretty easy, right?
Now try to a create child theme of another theme by yourself. If you have any problem creating a child theme, feel free to comment in the below section.
Stay Tuned for our more tutorials !!