How to Create a Child Theme in WordPress

How to Create a Child Theme in WordPress

Let me start you off with a little story. My first job as a professional web developer, I was working in an agency developing custom WordPress websites. This meant that every time we had a new client, we built them a new theme from scratch. The problem with this is that we would have to download Underscores, strip out all of the stuff we didn’t need, and then add all the code to make the theme their own. The problem with this is that a lot of our sites shared the same logic, but we were writing it over and over again. This was an astronomical waste of time, but I didn’t know any better, because this was my first job as a web developer as well as the first time I ever built custom WordPress themes. What’s the solution? WordPress child themes.

What is a WordPress Child Theme?

From the Developer Handbook:

A child theme allows you to change small aspects of your site’s appearance yet still preserve your theme’s look and functionality. To understand how child themes work it is first important to understand the relationship between parent and child themes.

What is a Parent Theme?

A parent theme is a complete theme which includes all of the required WordPress template files and assets for the theme to work. All themes – excluding child themes – are considered parent themes.

What is a Child Theme?

A child theme inherits the look and feel of the parent theme and all of its functions, but can be used to make modifications to any part of the theme. In this way, customizations are kept separate from the parent theme’s files. Using a child theme lets you upgrade the parent theme without affecting the customizations you’ve made to your site.

Child themes:

  • make your modifications portable and replicable
  • keep customization separate from parent theme functions
  • allow parent themes to be updated without destroying your modifications
  • allow you to take advantage of the effort and testing put into parent theme
  • save on development time since you are not recreating the wheel, and
  • are a great way to start learning about theme development

Basically, it allows you to make changes to the theme without actually changing the theme (follow me?). You can customize your theme to your heart’s content, while still allowing changes/updates to the main, or parent, theme without breaking anything.

How Do I Create a Child Theme?

Easy peasy.

  1. In your wp-content/themes/ folder, create a new folder for your child theme. You can name it whatever you’d like.
  2. In that folder, create a file named style.css.
  3. In that file, put the following content:
    /*
     Theme Name:   Child Theme
     Theme URI:    https://thefancyrobot.com
     Description:  Child theme for thefancyrobot.com
     Author:       The Fancy Robot
     Author URI:   https://thefancyrobot.com
     Template:     parent-theme
     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:  textdomain
    */
  4. Be sure to change the parameters appropriately:
    • Theme Name: The name of your child theme. You can put anything in here, but don’t name it the same as any other theme you have installed.
    • Theme URI: The web address for your theme. In this case, just put the URI for your website.
    • Description: Description of your theme.
    • Author: THAT’S YOU!
    • Author URI: If you have a website separate from the one you’re currently working on, put that here.
    • Template: The directory of the parent theme.
    • License: The license for the code you’re writing. This isn’t absolutely necessary, but if you’re going to be sharing this code, or you’re developing for a client, I would include a license.
    • License URI: URI for the actual license text.
    • Text Domain: This is for translating your website. This is commonly just the name of your theme (all lowercase, and one word). I recommend adding this even if you don’t plan to implement translations.
  5. Create a functions.php file, and add any additional functionality you need in there.
  6. If you’d like an image to show on the theme selection page in the WordPress admin, just create an image and save it as screenshot.png in the root directory of your child theme.

And now you have a child theme. After activating the child theme in the WordPress admin and WordPress will load both your parent them and your child theme. Any template files in your child theme will now override the templates in the parent theme. This opens the door to a ton of custom functionality without worrying about updates to your parent theme breaking things.

Leave a Reply

avatar
  Subscribe  
Notify of