Posted on

Learning how to make a child theme is one of the most vital items in your WordPress toolkit. I could go on for hours about why child themes are important (and arguably mandatory) for handling theme customizations, but for now let’s just get right to the tutorial. Pay attention kids, this one is gonna go fast:

Step 1: Create a new home for your child theme.

Inside your wp-content/themes/ directory, create a new directory named “ParentTheme-child.” The actual name of this directory isn’t important, but for the sake of keeping things organized, I like to maintain the name of the parent theme. So if you are making a child theme for “Divi,” you would name your new directory, “Divi-child.

Step 2: Copy some theme files into your new directory

Go into the parent theme’s directory and copy the following files…

Mandatory:
functions.php
style.css

Optional (but usually needed):
header.php
footer.php

Paste these files into your child theme’s directory.

Step 3: Edit the child theme files

First, go into your new functions.php directory in your child theme and delete everything. Yes, everything. Paste the following and then save the file.

<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' ); function theme_enqueue_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); }

(Note: Make sure you don’t forget that opening PHP tag. It is okay to skip the closing tag)

Now open your child theme’s style.css file, delete everything except the intro statement. Add a “Template” line with the name of the parent them.

/*
Theme Name: Twenty Fifteen Child
Theme URI: http://example.com/twenty-fifteen-child/
Description: Twenty Fifteen Child Theme
Author: John Doe
Author URI: http://example.com
Template: twentyfifteen
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: twenty-fifteen-child
*/

Again, for the sake of clarity and keeping things organized, I like to maintain the parent name when naming the new child theme. Using the “Twenty Fifteen” theme as my example, you can see which items need to be changed and which need to be maintained. If you decide to be a rebel, just take note that the “Template:” line absolutely must use the name of the parent theme.

That’s it! You can now go into your admin dashboard and activate your new child theme.

2 Replies to “How to Make a Child Theme”

  1. Thank you very much for this post and the clear directions. This is the best, most clear set of instructions on creating a child theme that I have found.

Leave a Reply

Your email address will not be published. Required fields are marked *