WordPress Child Themes

What you need to know about wordpress child themes

Once you’ve chosen a suitable theme for your website, you may need to make minor changes. However, doing so can mean opening yourself up to many problems, not the least of which is losing your changes when the theme is updated. Child themes – those that inherit their parent theme’s functionality and styling – make the process of editing any theme both easy and safe.

In this post, we’ll introduce you to the potential perils of WordPress theme editing. We’ll then discuss the advantages that child themes provide, as well as how you can create them yourself (either manually or with a plugin). Let’s get started!

Editing Your WordPress Theme: Don’t Do It Without a Child Theme

Editing your WordPress theme can be a nerve wracking experience. After all, even one minor mistake on your part can cause hours of stress as you work to right your wrongs.

In addition, any changes you make to your theme will be lost as updates are released. You then have to make the difficult decision to stick with your current version and risk security vulnerabilities, or update your theme and lose all of your hard work.

Child themes are the solution to both issues, as any changes you make are preserved regardless what happens to the parent theme.

Child Theme Advantages

Aside from the various issues that child themes prevent, they have additional advantages. Foremost, they enable you to make customizations to your website directly, as there’s no need to worry about template files or extensive coding.

Additionally, child themes are incredibly flexible. They enable you to extend your website’s functionality, and the changes you make can be easily accessed and modified at any time.

How to Create a WordPress Child Theme

Anyone can create their own child theme for WordPress. If you choose the manual route, there are three main steps you’ll need to follow. They are:

  1. Create a new folder in wp-content/themes.
  2. Create a dedicated Cascading StyleSheet (CSS) file.
  3. Create a functions.php file.

To complete the steps above, you’ll need access to a File Transfer Protocol (FTP) client. Your host likely has one, or you can use an open-source option such as FileZilla. You can find the information you need (such as host, username, and password) on your host’s back end.

Once you’re connected, locate your website’s root folder (it’s usually called public_html, www, or the name of your website), and navigate to wp-content > themes. Right click within the pane, create a new folder, and name it after your parent theme, appended with –child. This designates it as a child theme to WordPress:

How to create a wordpress child theme

Next, enter this new directory, right click, and select Create new file. You’ll name this style.css, and this will be the child theme’s stylesheet. Of course, it’s not a true stylesheet until you enter CSS code. Simply copy and paste the below code into the new file (changing any of the example text to match your own theme), and save your changes:

/*
Theme Name: Twenty Fifteen Child
Theme URI: http://example.com/twenty-fifteen-child/
Description: Twenty Fifteen Child Theme
Author: John Doe
Author URI: http://example.com
Template: twentyfifteen
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: twenty-fifteen-child
*/

Next, you’ll need to make sure your child theme can access the current style of your parent theme. To do this, follow the same steps as above, but this time name the file functions.php and add this code:

<?phph
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

This allows the parent theme’s stylesheet to be loaded whenever the child theme is used. Finally, navigate to Appearance > Themes in WordPress, locate your newly-created child theme, and activate it. Your website’s child theme should now be your primary option.

Child Themes vs. Custom CSS

At some point, you may find yourself wanting to make small stylistic changes to your website. The question then becomes: Should you update your child theme’s stylesheet, or input custom CSS?

Simply put, custom CSS is an area within WordPress’s Theme Customizer (and other third-party plugins) enabling you to add CSS that overrides the theme’s default style options. You can make simple changes here, such as background color and font style:

child theme vs custom css

You can also make these same changes within the child theme’s stylesheet, though not it’s not as easily accessible as using a custom CSS module.

In short, you could use custom CSS without any issues. However, on the whole, we recommend using a dedicated child theme, as you aren’t going to encounter any issues when a parent theme is updated.

Child Theme Plugins

Of course, the quickest way to implement child themes on your WordPress site is via plugins. Let’s look at some of the most functional options.

1. Child Theme Configurator

Child Theme Configurator wordpress plugin

Child Theme Configurator is a popular option found in the WordPress Plugin Directory. With just a few clicks, you can have your new child theme active and ready to roll. You can even make various customizations with the help of plugin support.

This plugin also enables you to see how changes to the child theme’s stylesheet will look before you implement them. This can save you even more time, as you modify your theme to fit your website’s needs.

2. Child Theme Creator by Orbisius

Orbisius child theme creator wordpress plugin

While not as popular as the above option, Child Theme Creator by Orbisius is still a viable choice for anyone in need of a simple, yet effective, child theme plugin. You can create child themes with just one click using the simple interface, and you can even combine elements from different child themes to make your own unique creation.

If that’s not enough, Child Theme Creator also uses minified CSS. This helps ensure that your theme – and as a result, your website – loads quickly.

With the use of child themes, there seems to be almost no limit to what you can do. This is just one reason why WordPress is an excellent platform for anyone looking to create beautiful and dynamic digital experiences. If you’d like to further enhance this experience – both for yourself and your site’s visitors – let WP Engine help!

Get started.

Build faster, protect your brand, and grow your business with a WordPress platform built to power remarkable online experiences.