How To Create A Child Theme | premiumwd
Development / Tips & Tricks

How To Create A Child Theme

by chris rodriguez on November 30, 2013

According to a recent WordPress Themes Survey, 85% of our customers customize their themes, and only 35% use a child theme when doing so. This may be due to a lack of understanding as to what a child theme is, or due to the perceived difficulty of creating one. In this tutorial, we will go over how to create and use child themes, and why using them is so important. If you are only looking to perform simple CSS changes to your theme, then you can use the Custom CSS box in theme options instead of creating a child theme. For more in-depth changes that require editing php files, a child theme must be used.)

 

Why You Should Be Using Child Themes

Creating a child theme when performing adjustments to your theme’s code can save you a lot of future headache. Child themes allow you to make changes without affecting the original theme’s code, which makes it easy to update your parent theme without erasing your changes. By creating a child theme, you create a separate set of files that you can use to customize the theme without affecting the original theme at all. Not only does this make updating easier, it also makes sure that you will never ruin your original theme as you are never actually modifying the files. You can always turn off your child theme and fall back on the original.

 

Getting Started

In this example, we will be creating a child theme for our Innovate theme. First things first, we need to create a new folder for your child theme. Naming it something like /innovate-child/ is conventional. Within your new theme folder, create a file called style.css and fill in the information as outlined below. The theme Name, URI, Description and Author are totally up to you.

/*
 Theme Name:     Innovate Child Theme
 Theme URI:      https://www.premiumwd.com/themes/innovate
 Description:    Innovate Child Theme
 Author:         Premium WordPress Themes
 Author URI:     http://www.premiumwd.com
 Template:       Innovate
 Version:        1.0.0
*/

@import url("../Innovate/style.css");

/* =Theme customization starts here
------------------------------------------------------- */

 

The most important parts of this file are the “Template:” and @import sections, which identifies the parent theme imports the CSS from the original. You must ensure that the path to your parent theme’s css file is correct, and that the “Template:” parameter correctly identifies the name of your parent theme. If you are using a different theme, then adjust the values accordingly. Everything must be case sensitive! The folder of our parent theme is “Innovate” with a capital I, and the @import URL reflects this.

 

Activating Your Child Theme

After you have created your child theme folder and style.css file, you can upload and activate your new child theme. Uploading and activating a child theme is no different than a normal theme, simply upload it via the Appearances > Themes page in your WordPress Dashboard and activate it. Before you upload it, you must first ZIP it. Mac and Windows both have native ZIP functionality. Make sure that your parent theme is also uploaded (In the case of our example, the Foxy theme).

 

Additional Child Theme Resources

1. The One Click Child Theme Plugin – If you are having difficulty wrapping your head around the creation of the child theme folder, then this plugin will create one for you with the click of a button!

2. The WordPress Codex - There is all kinds of great documentation in the WordPress codex. If there is anything you need clarification on in this post, then this should be your first stop.

3. Child Theme Pros and Cons - For more information about the pros and cons of using Child Themes, WP Beginner has a great writeup.

Design tips, tricks, and freebies. Delivered weekly.

Get design tips and tricks, latest news from us and some goodies for signing up.
Email Address...
Give it a try—it only takes a click to unsubscribe

You might also like...

 Development / WordPress

5 Ways to Make Your WooCommerce Store Swift and Faster

Starting an online store with WooCommerce is pretty simple. You just need to select a domain, a hosting plan and…

 Plugins / Tips & Tricks / WordPress

11 Amazing WordPress Plugins for 2017

Instead of writing a regular top ten piece, I decided to focus on WordPress plugins that you probably don’t know about….

 Development / Tips & Tricks / WordPress

4 Effective Ways to Help Grow Your WordPress Blog

 Many bloggers misuse the marketing concept: “If you build it, they will come.” Content may be the primary building block…

No comments

Sorry, the comment form is closed at this time.

Subscribe to Blog

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

See why people are switching to use our products. See Features Get Started
+ +

Get awesome design content

Get design tips and tricks, latest news from us and some goodies for signing up.
Email Address...
Give it a try—it only takes a click to unsubscribe
%d bloggers like this: