The market for premium WordPress themes have grown big in recent times and has eased the life of us web designers as it caters the demand for simple-intermediate websites with quick turn around time. However there are times when clients demand to customize these premium WordPress themes with additional functionality or styling.
The basic approach is to customize style.css or include a separate stylesheet or edit functions.php which otherwise is a no nonsense shortcut, however there is a catch; if you make changes to a parent theme’s files, those changes are overwritten when you update the theme next time. The situation can be code red, with client yelling at you for a broken website, and you in the middle of no where without a backup. Creating a child theme can save you from this difficulty. Wondering how? A child theme inherits all features and appearance of its parent theme. By creating a child theme, you build a separate set of files that can be used to customize the theme without affecting the original files. Not only does this make updating easier, but also makes sure that you will never ruin your original theme and can get along with frequent security updates from theme authors. You can always turn off your child theme and fall back on the original when required. In this article, I will go over telling you how to create and use child themes.
Let us create a child theme for say, Divi Theme – as it is one of the most powerful, flexible, and elegant themes in WordPress.
Fundamentally, we need to create a new folder for your child theme, which will be placed in wp-content/themes. Lets name it something like /Divi-child/ which is conventional. It is recommended to append your file name with “-child”. There shouldn’t be any spaces in your child theme directory, as it will return errors. Within your new child theme folder, create a file or a stylesheet called ‘style.css’ and fill in the vital details as outlined below. The Theme Name, URI, Description and Author are totally up to you. This will load the stylesheet of the parent theme.
Something important to note here is that, “Template:” parameter must be correctly stated as the name of your parent theme.
Now, we need to create a file named ‘function.php’ in the child theme folder. Functions.php is where a theme’s main functions are stored, and this file acts like a plugin and is used to define functions, classes, actions and filters that can be used by other templates in the theme and can be used to add features and extend the functionality of the theme. The child theme inherits the functions of parent theme by default, but if you need to add more custom functions to your theme then you can do so by creating a new functions.php file within your child theme folder. In between php opening/closing tags, you can add your desired php code. Create a file named functions.php in the child theme folder, edit it, and add the following code snippet:
<?php
add_action( ‘wp_enqueue_scripts’, ‘my_theme_enqueue_styles’);
function my_theme_enqueue_styles()
{
wp_enqueue_style(‘parent-style’, get_template_directory_uri() . ’/style.css’);
}
?>
Finally let’s activate your theme. Zip the child theme and upload it via Appearances > Themes in your WordPress Dashboard and activate it. Your child theme will then be shown as the active theme. You can literally experiment anything in this child theme without the fear of breaking anything, and teamwork too becomes more productive as another team member can easily identify customizations made by you, even in your absence.
Building a child theme in WordPress is not that complicated, right? Go ahead and create a child theme today with whatever changes you wish to bring in a website. Do let me know your experience while working, through your comments.
