Child Themes For The Win

Creating A Child Theme

You’ll often hear that the “right way” to customize a WordPress theme is by creating a child-theme. The idea is that by placing your customizations in the child theme, when the parent theme is updated, you’ll be able to keep your customizations and easily apply the update to the original one. It’s a great idea, so let’s walk through how to create one.

Install One-Click Child Theme Plugin

Our first step is to install/activate the One Click Child Theme plugin on your site. To do that, go to the plugins section of your WordPress control panel and select “Add New.” Search for “One-Click Child Theme” and install the plugin from the list that comes up.

Once you have the plugin activated, go to the Appearance section in your WordPress control panel. Click on themes and make sure you have the theme activated that you’d like to use. The active theme is the one shown at the top the themes page.

Active Theme

Child Theme OptionsNow click “child theme” from the menu in the Appearance section, or in the list of links under the current theme’s name. Here you can set the options for your child theme. You can give it a name, a description and also enter in your name. These items will be visible when selecting a theme from your themes list in the Appearance section later on.

After you click “create child” you may see an array of items at the top, but don’t worry. Once it’s finished, click on themes and you should see your new child theme as the active one.

Child Theme Activated

Congratulations! You just created your first child theme.

Basic Customizing With A Child Theme

Now that you have a child theme created, what can you do with it? First head to the Appearance section and select Edit. This will open up the theme editor. By default it will open up the current theme’s style.css file.

theme editor

At the top of this file you’ll see the name you’ve given to your child theme along with the other information you gave the plugin. Below that is this line:

[css] @import url(“../foxy/style.css”);

That tells our child theme stylesheet to import the parent theme’s stylesheet. That way we can simply override parts of it with new styles in the child. Because of how CSS styles work, styles loaded last override earlier styles.

So say we wanted to turn take the main content area in Foxy and change its width from 620 pixels to 420. We would look through the parent theme’s style.css file until we find the style that controls the width:

[css] #content {
position: relative;
width: 620px;
margin-right: 0;
padding: 0 30px 30px;
float: right;
background-color: transparent;
background-color: rgba(0, 0, 0, 0.84);

and copy it and paste it into our child theme’s style.css file. Now since we’re only changing the width, we can delete the other elements–since they’re in the parent theme’s styles, they will remain. All we would need is to add this:

[css] #content {
width: 420px;

and save our changes. That will change the appearance like this:

Foxy Full WidthFoxy Half Width

So that’s how you can make some basic CSS changes by using a child theme. In the next article, we’ll talk about how you can modify other files in the parent theme with the child.


Tangeray May 4, 2015

Great post Bill – long time no speak. So far I haven’t been affected by Organized Themes updates as with a template I’m using for another site. Kudos.

Seeing as a child theme overwrites in CSS – is running a child theme much slower?


    Bill Robbins May 4, 2015

    Hello Robert. Glad you haven’t had any update issues. If you only have a small amount of CSS to override, I would just place it in the custom CSS either in the theme options or in Jetpack’s custom CSS area. If you have more than just a few styles, adding a child theme would be a good idea. You’re less likely to accidentally delete it that way.

    There might be a very slight delay with the first page load because of one more resource to load, but realistically it will be very small. Probably in the tens of milliseconds. But on subsequent page loads, it will be quicker since the actual HTML document will be smaller with the custom CSS out in a separate stylesheet that has already been cached.


Tangeray March 2, 2015

Hey Bill – thank you for this article!

Will I be able to use the theme editor to edit the child theme?

Is a child theme basically a backup of of your theme?


    Bill Robbins March 2, 2015

    Good question. More than a backup, it’s a way to modify a theme’s appearance or functionally in a way that still allows you to update the original theme in he future without losing your customizations. You can use the built in eme editor to make the changes as well. Its main limitation is that it can’t create files or folders which may be necessary depending on what you’d like to change.


besta October 29, 2014

Bill-This is extremely helpful. Keep up the good work


Patty September 9, 2014

Hi Bill. I have been searching the web and hope you can help. I am trying to understand what changes to the default WordPress theme require a child theme so as to not lose changes when the default theme is updated. I activated 2014 WordPress’ default theme. I used the options that came with the default theme to create the header, sidebars, posts, pages, footer, used plugins for facebook page, images in posts etc. If I update the 2014 theme which is currently requested, will I lose all this? Or are only customizations made beyond that allowed via normal 2014 dashboard options lost (such as had I modified 2014 to have the home page blog roll to be summary instead of entire post (current default))? I sincerely appreciate any insight you can provide.


    Bill Robbins September 9, 2014


    Great question. Those changes should be preserved when you update. The only ones you would lose (and need a child theme to prevent) would be any edits you make to the theme’s files. You would make those by going to the Appearance section in your WordPress dashboard and clicking on edit. Unless you’ve made changes there, you should be fine.



Stefano March 13, 2014

Hi Bill,
when next article??



    Bill Robbins March 13, 2014

    I do need to get back to this. Let’s see what I can cook up for next week.


Submit Your Comment

Get all of our 25 themes (along with future themes) for only 65 USD.Find out more