I’m starting to get requests for theme changes and I always recommend using a child theme. Many WordPress users don’t really understand WordPress Child Themes, so I thought I would develop a series of posts about using Child Themes with the Expressions WordPress Theme and the blogBox WordPress Theme.

Reference : WordPress Child Themes

The above link will take you to the Child Theme Documentation site at WordPress.org. It is the main source for documentation on Child Themes. At the bottom of the page is a list of further references/tutorials. If you are making major changes to a theme, the above link is the place to go.

What is a Child Theme ?

A child theme is an extension of the parent theme. It acquires the functionality of the parent theme, and allows the user to make changes to the look of a theme without affecting the code in the original theme. It is also possible to use child themes to change the functionality of the parent theme but that is beyond this first post.

When a theme is updated the entire code in the theme is replaced with the updated theme. If you modify the theme’s original code, then all your changes will be lost when you update your theme and you will have to re-enter them. If you have a Child Theme, then all your changes will not be affected by the update.


Creating a Child Theme

To create a child theme follow these steps :

  • Create a folder in wp-content/themes/theme_child
    • child_1You can do this directly in your website or on your desktop. I use Filezilla, and will typically work off the desktop and upload the folder to my website themes folder. I usually name the Child Theme by adding “_child” to the original child theme name.
  • Create a style.css file using a text editor and save it in your child theme folder. I use Notepad++ for editing files.
    • Do not use a word processor such as Microsoft Word. These programs insert unseen characters which can lead to unpredictable results.
    • The screenshot below shows the basic content of the style.css file. child_2The important lines are shown with the arrow.
    • The Theme Name is the name that will appear in your WordPress Admin Panel under “Appearance => Themes”.
    • The Template is the name of the parent theme folder. Make sure is exactly the same.
    • Finally line 10 imports the style.css from your parent theme to provide a starting point for your child theme. Note the reference to the parent theme directory. Change “expressions” to the directory name of the parent theme you are using.
  • Create a screenshot for the child theme. This is really optional. If you don’t have a screenshot WordPress will present a gray box where the screenshot would go. To create a screenshot I take the screenshot from the parent theme, load it into an image editing program such as GIMP, Photoshop, or Picassa. Add a “Child Theme” water mark to the screenshot and save it into your child theme folder.screenshot
  • That’s it. If not already installed, upload the folder to your themes directory.

Selecting your Child Theme

At this point you haven’t made any changes to the theme, and it is a good time to check that the child theme works. To do this go to “Appearance => Themes” in your WordPress Admin Panel. You will see the following screen.

child_3

Select the child theme and activate it and go checkout the site and see if it loads properly. Note that because you have selected a new theme you will have to re-set your header image and widgets. All the widgets that you used in the parent theme will be in the “Inactive Widgets” Tab. It really should only the a few minutes to get the theme back to where you wanted.

Child Theme Problems

Although I highly recommend child themes I will be the first to say child themes are not perfect and they can cause problems.

  • If you get a completely broken theme after you have selected the child theme, it is likely because you have not entered the correct template name or the correct directory in the @import line. Go back and double check these.
  • Some developers have not developed the theme to be compatible with child themes. Check with the theme author if you can’t get the child theme to work.
  • Many themes will have some special addins that may be difficult to work with inside a child theme. For example, I use Superfish for menus in both blogBox and Expressions. While tricky to work with, menu appearance can be manipulated in a child theme.
  • Make sure you have selected a parent theme that is well supported. All new themes at WordPress.org should be child theme ready, and offer excellent support through the forum there.
  • Remember to show your appreciation when you use themes and receive support from any theme author. Most theme authors spend hundreds of hours developing their themes. You should donate to the theme author who is helping you with your website.

The next post will start to get into the details of changing the Expressions Theme by using a child theme.

Happy Coding !