WordPress Tutorials Index | Web Page Design Tutorials Home

Creating a New WordPress Child Theme (Part 1)

As mentioned on the documentation of WordPress : "A WordPress child theme is a theme that inherits the functionality of another theme, called the parent theme, and allows you to modify, or add to, the functionality of that parent theme."

In other words, we can create a new theme (child theme) of our own by using the files of other themes (e.g. Twenty Ten), but without modifying the files. Now Let’s use Twenty Ten theme as the parent theme to create a new child theme.

Create a Directory for WordPress New Child Theme

First of all, create a new directory with the new child theme name (alexten):

Create a new wordpress child theme

Prepare a Stylesheet for the WordPress New Child Theme

The next step is to create a stylesheet file. The only REQUIRED file in a child theme is style.css. The style.css file is required and so important because it provides the header information by which WordPress recognizes the child theme, and it replaces the style.css of the parent theme.

Here’s the header information of style.css:

/*
Theme Name: Alex Ten
Theme URI: http://wordpress.org/
Description: This is a Child theme create with TwentyTen theme.
Author: Alex
Version: 1.0
Template: twentyten
*/

Note:
For a child theme, the "Template:" line is required in order that WordPress knows the parent theme (e.g. twentyten) of that child theme (e.g. alexten).

Following the header, use the @import rule brings in the parent’s stylesheet. 

/*
Theme Name: Alex Ten
Theme URI: http://wordpress.org/
Description: This is a Child theme create with TwentyTen theme.
Author: Alex
Version: 1.0
Template: twentyten
*/

@import url(“../twentyten/style.css”);

Note:
Don’t use other CSS rules above the @import rule, otherwise the parent stylesheet will not be imported.

Create a Theme Thumbnail for the WordPress New Child Theme

This is good to prepare a theme thumbnail to identify the new WordPress child theme. Create the thumbnail with any paint software.

how to create wordpress child theme

Upload the theme thumbnail to the new child theme directory as shown in the diagram below:

how to create wordpress child theme

Log in WordPress Admin Panel and navigate to:

Dashboard -> Appearance -> Themes

The new child theme should appear under the Available Themes menu:

how to create wordpress child theme

Now, the new child theme is basically created. Of course it has the same theme as the parent theme at this moment. The next steps are to customize the new child theme to your own that looks different from the parent theme.