Create WordPress Child Theme Without a Plugin

Create WordPress Child Theme Without a Plugin

How to Create WordPress Child Theme Without a Plugin

In this post, I will show you how easy it is to create a WordPress child theme without using a plugin. Yes! You will NOT use a WordPress Plugin or any child theme configurator website to create one. I will also discuss the importance of using a wordpress child theme and why it is recommended by wordpress developers.

I will also share with you my folder structure for a child theme. This is important, a proper folder structure will help you keep track of your files and make your code easy to read when you customize your website’s theme.

What are the importance of using a child theme in WordPress?

1. Customization

The number one reason why you should use a child theme is for customization. Using a child theme will help you customize page templates and theme’s functions without touching your main theme. You just have to copy the file that you need from your main theme folder to your child theme folder and customize.

2. Security

The next reason why you should use a wordpress child theme is for security. We all know that WordPress is still growing and improving and therefore their developers are updating its core functionality especially in security. Whether the updates are for new features, security, or bug fixing, it is required to update WordPress!

3. Compatibility

How is it connected to the child theme? Well, whenever we receive a WordPress updates, our themes should comply and should be compatible to the new update. No worries, theme authors are doing the update for us. All we have to do is to update the theme as well.

But! You have to be careful on updating the theme that you are using. If you have done some customization on your theme files. Your theme files will be replaced by the updated files when you update your theme. The result, you will loose your customized files or the page layout will revert to its default theme layout.

Using a child theme will keep your customized files in placed and will not be replaced or change whenever you update your main theme. Therefore your theme will be compatible with WordPress update, you kept your customization and your page layout won’t change. Now, you will not worry about the updates in the future.

Here’s how you can create a WordPress Child Theme Without a Plugin

1. Create a folder for your child theme

Open your WordPress installation folder and navigate through themes folder. You can open your folder with any editor but I recommend using VS Code because its really handy and there are lots of extension that will make your life easier.

test/wp-content/themes/

Create a folder inside your themes folder and name it anything you want. In this example I named it ‘childtheme.’

Create WordPress Child Theme
Create a folder inside the themes folder and name it ‘childtheme’

2. Then, create a CSS file and name it style.css

It is important to follow this because this is the file that WordPress is checking if its a valid child theme.

In this example, I will be using Divi theme as my main theme. Now, copy the following code and paste it inside the style.css.

/*
Theme Name: Childtheme
Description: This is a child theme for Divi Theme.
Author: Romel Indemne
Template: Divi
Text Domain: childtheme
Version: 0.0.1
*/ 
Create WordPress Child Theme
Create a style.css file and paste the code above

3. Create a file called functions.php

Create a functions.php file inside the child theme folder. Then copy the following code and paste it inside in your functions.php

<?php

function my_theme_enqueue_styles() {
    $parent_style = 'divi-style'; // This is 'divi-style' for the Divi theme.
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        '1.0.0'
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' ); 
Create WordPress Child Theme
Create a functions.php file and paste the code above

From this state you will be able to find your child theme on your WordPress Dashboard, navigate through Appearance>Themes. Notice that the child theme doesn’t have an image unlike the Divi theme. Continue reading and we’ll setup an image.

Create WordPress Child Theme
To confirm, you should be able to see your child theme in the Appearance>Themes section
Create WordPress Child Theme
Notice the image section is empty

You can extend the child theme’s information by editing the style.css. Maybe you want to add the author’s information or maybe you want to add an image. You can learn more bout it here.

To add an image just put a png or jpg file inside the child theme folder and name it screenshot.jpg or screenshot.png. And your good to go.

Create WordPress Child Theme
Create a png or jpeg file named screenshot and place inside the child theme folder
Create WordPress Child Theme
The child theme now has an image

My WordPress child theme folder structure

Now, I promised that I will share my child theme folder structure with you. You can download it from my github repository here.