Using a Child Theme to make modifications

December 24, 2013|

If you plan to customize your theme by making changes to any of the core theme files, even the style.css file, WordPress and Styled Themes recommends you use the Child Theme method instead of directly modifying the actual theme files. If you update a theme and you made modifications, guess what will happen? Your modifications will be totally lost and you will have to do it all over again. However, if you make your modifications using a Child Theme, then your changes will not be affected whenever you update the original theme (often called the Parent Theme).

When to Use a Child Theme?

  • When you need to make a colour change to any element that is not part of the customizer or theme option settings
  • When you want to change a font
  • When you want to change part of the layout
  • When you want to add something of your own
  • ….basically any changes you want to make to the official theme you downloaded

As WordPress states, a Child Theme is a Theme that inherits the functionality of the Encounters Lite Theme also know as the parent Theme, and allows you to modify, or add to, the functionality of parent theme. Another way to describe a Parent/Child theme is:

Basically these are two separate themes, but how it works that the child theme connects to the styles and functions of the parent theme and duplicates the parent theme. Because these are separate themes, when you update the parent theme, the child theme will adopt the new changes, but whatever was changed with the child theme, these won’t get overwritten because again, it’s a separate theme (separate files). Still a bit confusing but it’s why WordPress recommends any core changes to the theme is best done with the child one.

Child Theme needs to be either uploaded via FTP or simply over WordPress dashboard, when the Theme is on your site click activate and that’s it.

Whenever the Encounters Lite theme is upgraded, your Child Theme and all of your modifications will be safe and remain unchanged.

Note: I recommend reading about Child themes from the official WordPress.org website here:

About Child Themes

Getting Started

To help you get started, I’ve made a custom blank child theme for Encounters Lite which is ready for you to make any changes to your theme. Start by getting the child theme from the Encounters Lite theme folder where you will find the installable zip file in a folder “child-theme”.

IMPORTANT: I recommend to ALWAYS backup your theme before making changes, updating, or to simply keep a backup for those unforeseen circumstances.

How to Make a Change to Your Theme

I will give you a nice example here on how to make a change to the Encounters Lite theme using the newly installed Child Theme. We can start with changing the main font of our body text from PT Sans to Georgia. First, our HTML css looks like this in our style.css file for Encounters Lite:

html {
	font-size: 100%;
	font-family: "PT Sans", Arial, Helvetica, sans-serif;
	color:#747474;
}

To customize this and to change the font to Georgia, we ill now open the “Encounters Lite Child” style.css file and we will simply create an override style like this:

HTML {
font-family: Georgia, serif;
}

Info: You may notice that I did not add the line-height to the child theme’s style.css. This is because we are not changing it, so there is no need to add it.

Other Types of Customization

You are not just limited to css, but you can also modify the layout structure of theme files and templates as well. The child theme includes folders which match what the parent theme has (Encounters Lite) so then what you would be doing is copying the file from the same location in the parent theme of Encounters lite, then pasting it into the child theme (same location) and then make whatever changes you want.

Word of Advice

When making any form of change to your theme using a child theme, always make a backup of your original theme for those unexpected circumstances that sometimes happen and beyond your control. A few other helpful tid-bits:

  1. You should have a basic understanding of HTML and CSS
  2. It is recommended that you also have some understanding of WordPress theme coding
  3. Take things slow and try not to rush
  4. Most IMPORTANT, try to avoid making any changes to the parent theme, and if you have already, try to move those changes to the child theme and then make sure the original theme is back to its original state from when you first installed it. If you keep any modifications in the original parent theme, when you update the theme, your modifications will be lost and you will have to do them over.

If You Use the JetPack Plugin

If you are using or plan to use the JetPack plugin, you may not need the child theme. This is because JetPack includes a nice CSS Editor built in that lets you manage a theme’s stylesheet without the need of a child theme. The only caveat of this is that if you plan to modify any of the core theme files, either aside from or including the style.css file, then a child theme will be required. The JetPack plugin only lets you modify the stylesheet only.

 

 

 

Categories: Setup Tutorials for Encounters Lite

Leave a Reply