WordPress Child Theme is an answer to safely work with all your customization in your theme. Today we’ll talk on how to create WordPress Child Theme on your website.
For all those who just joined us and are new to this, must have a question in their mind.
- Why do I even need a child theme?
- Why can’t i work with without a child theme?
Well you need child theme because child theme works on primary theme infrastructure but is not touched while being updated. Which means all your customization in your theme remains as it is, even when you update your theme.
For Example: you mentioned your google analytics tag in your theme header section but have not created your child theme. In this case, whenever you’ll update your theme, those codes will get removed, as updates replace old codes with new ones at every place. Resulting google analytics will not be able to track your website data.
In case you have created your child theme, your primary theme will get updated without even touching your customized codes in your child theme.
Hope examples above answers both the question.
What is WordPress Child Theme:
To have a basic understanding, take it as a copy of your original theme within the website. Once created and activated, it works on behalf of your primary theme. This means that your primary theme will act as a base/layer for your child theme.
Now what child theme does is it copies every resource from primary theme and act on its behalf. But the game changer is that few codes which you edited in your child theme will not be touched by the primary theme ever.
It might be a bit confusing, but once you are done with this, you’ll understand what exactly i mean.
How to Create:
I have a very simple and free plugin suggestion for you to create your child theme.
- Go to plugin>>Add New
- Search for Child Theme Configurator
- Install and activate it.
Once you activated it, you’ll be able to see it under tools tab.
Click on Child Theme and you’ll be able to see these 4 options on the screen
Let’s understand what these actions do:
1. CREATE a new Child Theme
This action creates and install a new customizable child theme using parent theme as base. Which means that it’ll make a copy of your parent theme exactly as it is, without any modifications.
2. CONFIGURE an existing Child Theme
This action helps you modify your settings in your currently installed child theme with the help of configurator.
3. DUPLICATE an existing Child Theme
This action makes a copy of an existing Child Theme in a sub domain.
4. RESET an existing Child Theme
This action resets your child theme as a clean slate, as it was before, without any modifications. Think of it as a new child theme installed just now. (Note: This remove all the modifications you have done in your child theme previously).
Steps to create new child theme:
- Go to Parent/Child Tab;
- Under select an action>>Select Create a new child theme;
- Under select a parent theme>>scroll down to select a parent theme;
- Click analyze and it’ll determine stylesheet dependencies and other potential issues;
- Now name the new child theme;
- name the new theme directory;
- Select where to save new styles:
- Primary Stylesheet (style.css) – Save new custom styles directly to the Child Theme primary stylesheet, replacing the existing values. The primary stylesheet will load in the order set by the theme.
- Separate Stylesheet – Save new custom styles to a separate stylesheet and use any existing child theme styles as a baseline. Select this option if you want to preserve the original child theme styles instead of overwriting them. This option also allows you to customize stylesheets that load after the primary stylesheet.
- Select Parent Theme stylesheet handling:
- Use the WordPress style queue. – Let the Configurator determine the appropriate actions and dependencies and update the functions file automatically.
- Use @import in the child theme stylesheet. – Only use this option if the parent stylesheet cannot be loaded using the WordPress style queue. Using @import is not recommended.
- Do not add any parent stylesheet handling. – Select this option if this theme already handles the parent theme stylesheet or if the parent theme’s style.css file is not used for its appearance.
- Customize the Child Theme Name, Description, Author, Version, etc.: (Click to toggle form)
- Copy Parent Theme Menus, Widgets and other Customizer Settings to Child Theme: – NOTE: This will overwrite any child theme options you may have already set.
- Click the button to run the Configurator.
Always test child themes with Live Preview (theme customizer) before activating!
I shared my experience, now it’s your turn. Comment below, how you created your child theme?
If you find this article useful & helpful in any way, then don’t forget to “share” and “appreciate” it.
Feel free to ask questions, in case you feel stuck somewhere.
Note For Support
Please don’t forget to mention what you think is missing in this article. So that I can improve it for others as well.