A child theme is a familiar name that any WordPress users must know about. That does not mean all of them understand how great a child theme can create. The post will clarify you all things about this theme and prove that the development time will be much better if you take advantage of a child theme.
#1. What is a child theme?
Let’s make it easy as a pie!
Instead of directly customizing the theme as normal, you can make any changes you need in the child theme first. This way will keep you away from any errors during the updating process and preserve any changes you made in it.
#2. Why should you use Child Theme?
- Safe updates: If you modify a theme directly when you update, your modifications may be lost. By using a child theme you will ensure that your modifications are preserved.
- Speed up the development time: A child theme just includes functions.php and style.css. So you can customize quicker than in the parent theme with the same result. Hence, it will speed up the development time.
- Practice: You can do anything with the child theme without worries of losing your modifications. So, it’s a great practice place for you learn about WP theme development.
#3. How to create a Child theme for WordPress
To get a clear example, we will guide you create the child theme of Twenty Fifteen Theme. And for any theme you can apply these steps, all theme work fine by following them.
Step 1: Create a new folder in /wp-content/themes/.
Normally, child themes are located in /wp-content/themes/. In your WordPress installation. Hence, you will create a new folder for your child theme here.
The folder should be named like the parent name with adding the “–child“. In this case, you will name the child theme as twentyfifteen-child following the parent theme: Twenty Fifteen.
*Note: The name should be lowercase and does not include any spaces
Step 2: Create a style sheet
Inside of the new child theme folder, create a new file named style.css which is the style sheet for your child theme. This file is where most of your customizations will be made in this file.
The style sheet only works when pasting the following code lines right at the beginning of the file.
- Theme name: This is the name that will show up for your theme in the WordPress back end.
- Template: This part is crucial. Here goes the name of the parent theme, meaning its folder name. If you don’t put in the right information, you will receive an error message. Please carefully check!
Step 3: Active the child theme
Once your folder and style sheet is present, go to “Appearance” → “Themes” in the WordPress back end and find your child theme there. When you click on “Theme Details” now, you will see the contents of the style sheet header.
Then click “activate” Done! Your child theme is now activated.
Step 5: Inherit Parent styles
Instead of using the old method with @import, the new method of enqueuing the parent theme stylesheet is to add a wp_enqueue_scripts action and use wp_enqueue_style() in your child theme’s functions.php. By this way, you don’t need to create functions.php file anymore.
The first line of your child theme’s functions.php will be an opening PHP tag (<?php), after which you can enqueue your parent and child theme stylesheets.
#4. What must I take note when using a Child theme?
– You NEVER delete any files in the Parent theme
– When you want to customize file.php, please COPY IT from the parent theme to the child theme and edit in the child theme ON LY.
– When writing CSS, you must follow the rule “writing under the @import line” in the child theme.
– In case of customizing file .php which does not belong to the template, you must require it into file functions.php like the parent theme does. The best way is checking the file functions.php at the parent to know how to it require and do the same.
After all, Child themes will boost up your development time and crucially cultivate your skill with the practice as well. We hope you get something useful with this post. Don’t forget to share, tweet, and pin if you love this post! Your appreciation keeps us moving forward.