Creating a Child Theme for WordPress

Every now and again I run across websites that have a certain look or feel about them that inspires me. I love website design, and I am also familiar with the frustration with some themes having one or two certain desirable aspects while other aspects are not in any theme.

I really enjoy clean design and simple functionality.  I also know the frustration scanning countless themes before accepting the fact not a single one seems to have everything I want in a theme. Probably why there are so…so many different style themes. Then, I remember child themes.

Some recommendations changed since I worked with child themes. Why do we want to use a child theme? Many times we may want to make changes such as background color to our website which is easily done through the customization option available in most themes today.

Back some ten years ago, the option for changing Cascading Style Sheets (CSS) through customization did not exist.

We would need to create a child theme to make alterations; otherwise, we were stuck with the changes we make if we dare change the default theme which is like never appropriate. Creating a child theme gives you a sense of ownership over your work too.

Besides a great way to learn web design, you can also learn how to implement functionality within a child theme. When I begin college some seven years or so ago, I was just getting into learning Hypertext Preprocessor (PHP) and found the programming language easy to understand and use. If coding is not your thing, a couple of great plugins also exist allowing you to automatically create child themes.

Now, we create a child theme to be able to keep our changes. In other words, we may change the style of our theme style sheet but as soon as the theme updates all our changes are overwritten. So, I want to share how easy we can create a child theme so any changes are more under your control. If you get tired of the child theme all you have to do is create another one, but you get to keep the other child theme in case you decide you want to use it again.

  • Lets Get Started Already (first things first)

Depending on how you prefer to work, you can either access your root folder of your website through your hosting account or create a folder on your hard drive to upload later. For example, you can create files and folders via your hosting account or use a file transfer application such as FileZilla (my favorite).

You only need to create two files in order to utilize a functional child theme. One file is style.css and the other is a functions.php file. We create these files in order to reference our template (aka, default, parent) theme in our child theme. Just so you know, a parent theme is necessary to create a child theme. Without a parent theme, we can not create a child theme. A parent theme is a theme you choose having the basic bones you like yet some aspects you want to change. The child theme references the parent theme yet takes precedent over various aspects of the parent theme just as you would the customization feature in your current theme’s dashboard (ok I am repeating myself but this is important).

I always recommend those who want to start out learning the proper methods for using HTML, CSS, JAVASCRIPT, or PHP to Specifically, you can also learn proper coding for WordPress through WordPress Codex (check out the section of page titled “Lessons for Theme Development”; good stuff from the horse’s mouth).

  • Step 1: Create New Folder To House Child Theme Files 

To begin, navigate to your wp-content/theme folder of your WordPress site (or hard drive if you choose to upload all the files at once) and create a new folder with your desired child theme name (i.e., Your-Child-Theme-Name).

Make sure there are no spaces in your child theme name or the theme might not work right giving you frustration to no end. A child theme for say the free template theme “twentythirteen” might be “twentythirteen-child” without any spaces.

Note: Most advise naming the folder after the default theme where ThemeName becomes ChildThemeName or ThemeNameChild. You may down the road decide to create a variety of child themes for ThemeName such as ThemeNameChild1 and ThemeNameChild2, so you can stay organized if you name the child theme after the parent theme.

  • Step 2: Create Style.css file

Using a text editor, create a file and name the file style.css and save it in your child theme folder just created. With this new style sheet file open, place the following code filling in the related information of your new child theme. Everything highlighted will need changing while everything else stays the same.

 Theme Name: Twenty Fifteen Child
 Theme URI:
 Description: Twenty Fifteen Child Theme
 Author: John Doe
 Author URI:
 Template: twentyfifteen
 Version: 1.0.0
 License: GNU General Public License v2 or later
 License URI:
 Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain: twenty-fifteen-child


These are parent themes in my directory I can use as a template for a child theme that come free in WordPress.

Important: Make double sure the “template” line of the header section of the style.css file is exactly as the template theme name on the template theme folder supporting your child theme. You will need to have the template theme folder and all its contents intact and in the wp-content/theme folder where your child theme folder exists. Once you have all the correct information in your style.css file you can save the file.

  • Step 3: Create a function.php File

As I mention earlier, we use to just refer to our parent theme in our style sheet header using the @import rule. Our child theme style sheet would load first while referencing the parent theme style sheet. The time for all this to happen takes longer than using the PHP action wp_enqueue_scripts and  function wp_enqueue_style()  which technically does the same thing as the @import CSS rule only more efficient and faster. Enqueue means to perform certain actions in a certain order.

Once you create a file and name the file functions.php in your text editor go ahead and save the file in your child theme folder along with your child theme style.css file. Now, you should have your child theme folder with two files; the style.css and the functions.php file. With the functions.php file open you will need some code similar to the following code in there and remember to immediately save your work.

function my_theme_enqueue_styles() {

    $parent_style = 'your-parent-style'; // This is 'your-child-theme-style' for the Your Child Theme Name theme.

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );//This loads the style.css only
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

One last mention on the above code. In the $parent_style = 'parent-style'; line of code, you will need to open your template functions.php and see how the enqueue lists the $parent_style and replace how the template references 'parent-style' in the 'parent-style' section of your code for your child theme enqueue. So, for example I use “twentysixteen” template which references $parent-style = 'twentysixteen-style' in the Twenty Sixteen functions.php enqueue; so, I have the same line of code in my child theme functions.php file.

Final thoughts on the enqueue code process of creating a child theme. The idea that we are creating a child theme that needs a template theme to work tells us that the child theme does not replace the template theme nor does the child theme become a copy of the template theme. The reason our child theme is not a copy is because the template file style loads while the child theme loads second because of the functions.php file. So, our child theme we create and activate is our active theme.

I know you may think too much work goes into getting things linked up for a child theme in writing code and understanding the process. Remember, you can use plugins to create a child theme, if you prefer. Although, I think learning to code my own website by hand is rewarding and I think you will too!

  • Final Step: Upload File to Theme Folder of Website

Now that you saved your style.css and functions.php files in a folder with your preferred child theme name, you can upload the entire folder to your website directory. You can do so using FileZilla or upload through your hosting account navigating to the file directory. If you are unfamiliar with the process of adding files to your hosting account website, you may want to ask someone to help you. Navigate to the wp-content/theme folder of your WordPress installation and drop in your child theme folder.

You now can log into your WordPress dashboard where your child theme should be available for activation just as any other installed themes. Once you activate your new child theme and render the theme in your browser, you should not be able to distinguish between your template theme and your new child theme. This is the beauty of using. a child theme. Also, you can take a snapshot of your finished product (after you make changes in the css file) naming that image “screenshot.png” and just drop it in your child theme folder.

Thats all for now. Check back as I will be working to improve the look of my personal website, I might include another tutorial.