How to make a WordPress Child Theme Using Plugins and Custom Functions.php Code Guide For 2024

Child Theme
In This Article

Today I will tell a secret about a safe zone in WordPress, the WordPress “Child Theme”. Suppose, you added some code to your theme’s functions.php file to develop a custom functionality. 

 

After this you will update the theme as theme authors keeps updating it with new features, bug fixes and more. You will find out that the custom functionality is gone now.

 

How did this happen?

You need to understand that how updating the theme works. When you update your theme in WordPress your theme’s files get replaced by updated files downloaded from the theme’s server or the wordpress.org server.

 

How do I avoid it?

You don’t need to know rocket science to do this. It’s pretty simple. Just build a child theme for your desired theme which is your parent theme your website relies on. The child theme works as a extension to your installed theme.

 

Updating the main theme or parent theme will not override the child theme. As a result, you can add custom functionalities to your website without facing any problem. Child theme will also inherit the parent theme’s functionalities and design.

 

Do I get any other benefits?

You can avoid getting into an error while making changes to your theme’s code and avoid the trouble of coding and building a full theme from scratch.

 

How do I start making a child theme?

To build a child theme you need to create a theme folder in the path “/wp-content/themes/“. For example we can call our theme Hello Child. So, the folder will be “/wp-content/themes/hello-child/“. Basically, we will create a style.css and functions.php file.

 

You can also use a plugin from wordpress.org plugin directory in order to make a child theme. Here is a list of free plugins to build a child theme in WordPress:

 

* https://wordpress.org/plugins/child-theme-configurator/

* https://wordpress.org/plugins/child-theme-wizard/

* https://wordpress.org/plugins/wps-child-theme-generator/

* https://wordpress.org/plugins/wp-child-theme-generator/

 

Stylesheet Example

You will have to then create a style.css file in that folder with this stylesheet:

 

/*

Theme Name: Hello Child

Theme URI: https://example.com/hello-child/

Description: Hello Elementor Child Theme

Author: John Doe

Author URI: http://example.com

Template: hello-elementor

Version: 1.0.0

License: GNU General Public License v2 or later

License URI: http://www.gnu.org/licenses/gpl-2.0.html

Text Domain: hello-elementor

*/

 

How do I keep parent theme styles?

You can use this code below in your functions.php to add the main stylesheet of the parent theme:

 

add_action( ‘wp_enqueue_scripts’, ‘grand_sunrise_enqueue_styles’ );

 

function grand_sunrise_enqueue_styles() {

wp_enqueue_style(

‘grand-sunrise-parent-style’,

get_parent_theme_file_uri( ‘style.css’ )

);

}

 

Importance of Template

Here in this stylesheet you have to include the “Template:“, which should be the folder name of the parent theme. For example we used “hello-elementor” here.

 

I want to know more

You can find more and advanced information about building a child theme here in this link below:

 

https://developer.wordpress.org/themes/advanced-topics/child-themes/

 

If you find any misinformation or you have any problem with the content posted above, feel free to contact us and we will be investigating in the matter without any delay.