How to Create a WordPress Child Theme and Why

It’s easy to create your own child theme. Even with little css knowledge you can make changes to your site to make a more personalized theme and I’ll show you how to get started, explain how it works and the advantages of using a child theme.

What is a child theme?

A child theme is basically a theme that builds onto a parent theme without touching any of the parent theme files. A child theme relies on the parent theme for it’s initial layout, design, features and functions.

What is a parent theme?

A Parent theme can be almost any theme, it’s the base or “framework” of your child theme. Your child theme is built off of the parent theme. Think of the parent theme as a set of default colors and layouts for your child theme.

Why should I use a child theme?

Child themes are useful for a number of reasons. Since none of the parent theme files are touched, it is always safe to upgrade the parent theme and not have to worry about loosing your custom changes.
Using a child theme also makes it much easier to see what changes you have made. If you added custom changes to a parent theme, then it would be difficult to go back at a later time and remember what all of these changes were.

Child theme requirements

Child themes have very few requirements.

  • A Parent theme
  • Child theme folder
  • style.css with proper import for parent style.css and templates
  • screenshot thumbnail (optional)

How it works

Your child theme resides in the theme directory along with your parent theme. The child theme imports the templates and stylesheet and displays everything just as the parent theme does.
Any changes you make to the child theme will override the parent theme.

Here’s an example. Lets say the original color of your site title is black (#000000) and you want it to be grey. Simply add the proper CSS to your child theme style.css such as #site-title a { color: #DDDDDD; } and it will display as grey.

Your child theme can be as simple as just a stylesheet, but you can also modify template files as well. To modify a template file, simply copy the template file into your child theme folder, and it will use that instead of the one in the parent theme folder.
Example: Lets say you wanted to add a copyright notice to the footer of your theme. You might copy footer.php from your parent theme, into your child theme folder, then add the copywrite code to that.

How do I make a child theme?

Making a child theme is easy, here are the steps to take to create your own.

  • Create a folder and rename it to whatever you want your child theme to be called.
  • Open the folder and create a file called style.css open it in your Notepad++ or whatever editor you want to use (notepad will do).
  • Add the following code to the style.css
/*
Theme Name: Theme Name
Theme URI: http://yoursite/yourtheme
Description: A child theme of 2010 default WordPress theme.
Author: Your Name
Author url: http://yoursite.com/
Version: 1.0
Tags: black, blue, white, fixed-width, custom-header, theme-options
Template: twentyten
*/
@import url('../twentyten/style.css');

This code tells your child theme to import the style.css and templates from Twenty Ten theme.

There are two areas you will need to change to reflect whatever parent theme you are using.(you should also change theme name, url etc)
Template: twentyten should be changed to your parent theme name
@import url(‘../twentyten/style.css’); twentyten should be also be changed to your parent theme name.

That’s it! Now upload your new child theme and activate it. Congratulations, you’ve just created your own child theme.

You probably noticed it doesn’t look any different than the original and that’s how it should be. Now you get to add your own custom changes to it. You can browse this site for examples on what you can do with your child theme, or use your imagination and change colors, restyle the layout, or even add your own features.

Here are a few child theme templates you can use for the default WordPress themes. Download them for free and use them as your own!

Twenty Fifteen Child Theme
Blank TwentyFifteen Child Theme

Twenty Fourteen Child Theme
Blank TwentyFourteen Child Theme

Twenty Thirteen Child Theme
Blank TwentyThirteen Child Theme

Twenty Twelve Child Theme
Blank TwentyTwelve Child Theme

Twenty Eleven Child Theme
Blank TwentyEleven Child Theme

Twenty Ten Child Theme
Blank TwentyTen Child Theme

Here is a list of helpful sites with tips on editing themes and more information on WordPress child themes.

Aaron.jorb.in
Transformationpowertools.com
Voodoopress.com
WordPress Codex

One thought on “How to Create a WordPress Child Theme and Why

  1. Pingback: Cómo crear un tema hijo en WordPress y por qué debemos hacerlo

Leave a Comment

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

*
*