Child Themes

 

Just when I thought WordPress was going to be my least favorite part of web design, along came the whole concept of child themes to cheer me up.

A child theme is like a copy of your theme that runs along side your main, or “parent” theme.  You can make small, or even major, modifications to the child theme without actually changing the parent the theme.

But, why would you want to go through the bother of creating a child theme when you can just make your modifications to the parent theme?  Well, I think there are two main reason.

First, it gives you all of the functionality of the parent theme without having to design the theme from scratch.  This is a huge time saver. Secondly, and probably most importantly, the next time your theme is updated by the theme creator, you won’t lose all of your customizations.

When you make your adjustments to the child theme and the parent theme is updated, you won’t be at square one.  You will still have all of your modifications in your child theme, and the update may mean you have to make a few changes here and there, but you won’t have to start all over again.

One of the best parts of child theming is how easy it is to get started.  Your parent theme will live in your wp-themes directory.  You will create a new folder in the same directory and give it a different name.  You will then need to create a style.css file to live in this new child theme directory.  This file will need to hold some important information:

/*
Theme Name:ChildTheme
Theme URI:http://myhomepage.com/
Description:This is a child theme
Author:AweomeWordPressDeveloper
Author URI:http://www.myhomepage.com/
Tags:coolstuff
Text Domain:parenttheme
License: GPL
License URI: http://www.gnu.org/copyleft/gpl.html
Template: parentthemename
*/
@import url (‘../parenttheme/style.css’);

The two most important parts are Template:parentthemename, which tells WordPress that this is a child theme, and the @import url line which tells wordpress to load the parent theme’s style.css file.

You should now be able to see your child theme when you log into your WordPress account.  Activate your child theme and it should look exactly like the parent theme.  It’s that easy!

Now comes the fun part!  You can make all of the modifications you want in your child theme.  All of your style changes that you want to make, you will make in your new child theme’s style.css file.  As a newbie, it can be challenging to figure out how to implement modifications. Inspect element is going to be your best friend.

If you find that you need to make changes that aren’t in your CSS file, then it’s important to note that files in your child theme with the same name should override the parent theme.  I think that this is a little preview of next week’s adventure, which will be about template hierarchy.

Lastly, one of the things that I found is that you can add templates to your child theme without adding them to the parent theme.  While I’m new at this and I may be wrong, I’m pretty sure that this really opens up the customization options for your child theme.

I’m really excited to see what’s next in store when creating my WordPress websites.  I’m starting to see that using a child theme will still give flexibility when designing pages while eliminating the need to “re-invent the wheel” every time you create a website.

 

 

Photo Credit: HTSABO