{"id":3319,"date":"2020-03-01T07:56:35","date_gmt":"2020-03-01T02:56:35","guid":{"rendered":"https:\/\/webplover.com\/hosting\/?p=3319"},"modified":"2022-02-12T13:33:00","modified_gmt":"2022-02-12T08:33:00","slug":"wordpress-child-theme","status":"publish","type":"post","link":"https:\/\/webplover.com\/hosting\/wordpress-child-theme\/","title":{"rendered":"What is WordPress Child Theme and How to Create it"},"content":{"rendered":"\n
What is Child Theme?<\/h2>\n\n\n\n
Child theme is a sub theme which needs a parent theme to work. Because a child theme inherits the parent theme’s look and functionality. A parent theme is a complete theme which consists all the required WordPress templates. All themes exclude child theme, considered parent theme.<\/p>\n\n\n\n
Usually a child theme needed two files style.css<\/code> and functions.php<\/code> to work properly.<\/p>\n\n\n\n
Benefits of the Child Theme<\/h2>\n\n\n\n
Speed up development :<\/strong> Using a child theme you can speed up your theme development, because you can use the parent theme templates in your child theme and also too much functions already defined in the parent theme, you can use them directly in your child theme. In other words, you will not need to create a new theme from scratch.<\/li>
Fallback option : <\/strong>By default WordPress checks the active theme templates first then checks the parent theme templates. So if you make a mistake in writing your child theme code, WordPress will automatically use your parent theme code without throwing an error.<\/li>
Not Losing Changes :<\/strong> if you make some changes and customization to your theme, after update your theme, all your customization and changes will be lost. In this case Child theme will help you to protect your customization.<\/li><\/ul>\n\n\n\n
How to Create a Child Theme?<\/h2>\n\n\n\n
There are two ways to create Child Theme.<\/p>\n\n\n\n
Manually<\/strong><\/li>
Using Plugin<\/strong><\/li><\/ul>\n\n\n\n
Create Child Theme Manually<\/h2>\n\n\n\n
Before starting you’ll need the access to your file manager.<\/p>\n\n\n\n
You can achieve it by Cpanel <\/strong>\u00bb File Manage<\/strong>r or using FTP<\/strong><\/p>\n\n\n\n
Let’s Start<\/p>\n\n\n\n
In this example we will create a child theme of Astra theme, means Astra will our parent theme.<\/p>\n\n\n\n
Note : The process will be same on all the WordPress themes.<\/p><\/blockquote>\n\n\n\n
Step 1:<\/h3>\n\n\n\n
First of all create a new directory for your child theme in wp-content\/themes<\/code> and name it which you want. I named it astra-chlid<\/strong> now my child theme path is wp-content\/themes\/astra-child<\/code><\/p>\n\n\n\n
Step 2:<\/h3>\n\n\n\n
In this step we will create the two essential files in the child theme directory<\/p>\n\n\n\n
style.css<\/strong><\/li>
functions.php<\/strong><\/li><\/ul>\n\n\n\n
To create style.css<\/code> file, simply create new file and name it style.css<\/code> then open it in your favorite Text Editor.<\/p>\n\n\n\n
Add the below code to it and save.<\/p>\n\n\n\n
\/**\nTheme Name: astra-child\nAuthor: Brainstorm Force\nAuthor URI: http:\/\/wpastra.com\/about\/\nDescription: Astra is fast, fully customizable & beautiful theme.\nVersion: 1.0.0\nLicense: GNU General Public License v2 or later\nLicense URI: http:\/\/www.gnu.org\/licenses\/gpl-2.0.html\nText Domain: astra-child\nTemplate: astra\n*\/<\/code><\/pre>\n\n\n\n
Note : template-name<\/code> is most important for style.css<\/code> file if template name will not exist, child theme will not working.<\/p>\n\n\n\n
Now our style.css<\/code> file is ready, let’s create functions.php<\/code> file.<\/p>\n\n\n\n
Like style.css<\/code> create a new file and name it functions.php<\/code> and open it in text editor.<\/p>\n\n\n\n
It will load the child style.css file.<\/p>\n\n\n\n
Step 3:<\/h3>\n\n\n\n
Your child theme is ready to use. Let’s activate it.<\/p>\n\n\n\n
Go to WordPress dashboard \u00bb Appearance \u00bb Themes<\/strong><\/p>\n\n\n\n
You will see your new child theme here, this time it has no image but you can add image to it easily by going to your parent theme directory and copy the screenshot.png then paste in child theme directory or you can make your own image of 1200 pixels wide and 900 pixels tall.<\/p>
It’s important to name your picture screenshot.png<\/strong><\/p><\/blockquote>\n\n\n\n
Select the child theme and click on activate button.<\/p>\n\n\n\n
![\"wordpress-child-theme-configurator-plugin\"](\"https:\/\/webplover.com\/hosting\/wp-content\/uploads\/2020\/03\/wordpress-child-theme-configurator.jpg\")
<\/a><\/figure>\n\n\n\n