How to use WordPress child themes

How to use WordPress child themes

Child themes provide a convenient way of making changes to your site which are then not overwritten when you upgrade your WordPress theme.

A child theme is a theme linked to another theme known as the parent theme. The parent theme will contain all files for the theme, whereas the child theme should only contain files that differ from the parent theme.

An example of how you might use a child theme

For example, you might wish to change one of the PHP template files or a CSS file. Although you can create new files from scratch, the normal approach would be to take a copy of the file from the parent theme and then make any changes that you need.

What happens to my child theme when I upgrade the parent theme?

What you have to bear in mind, is that if you override a file from the parent theme in your child theme, when you come to upgrade the parent theme, any additions to this file will not automatically be copied across into the child theme. Your modified copy of the file in your child theme will remain unchanged and stay at the old version.

This means that after an upgrade, you may need to re-add any changes that you made in your child theme to latest versions of files from the parent theme.

Making life easier when upgrading the parent theme

To reduce the impact of upgrades on your child theme, you should try to minimise the amount of code that you change in files that you override from your parent theme. One way to achieve this by including other files using PHP.

For example, rather than adding new functions directly to functions.php, you could create a new PHP file called myfunctions.php and include this file at the top. Then when it comes to the upgrade, all you need to do is re-add the one line into the new version of functions.php taken from your parent theme.

include( get_stylesheet_directory() . '/myfunctions.php');

When making CSS changes you can take a similar approach by using myfunctions.php to include a new stylesheet rather than updating the existing stylesheet directly.

function my_styles() {
    wp_enqueue_style( 'mystyles', get_stylesheet_uri(). '/mystyles.css' );
}
add_action( 'wp_enqueue_scripts', 'my_styles' );

Submit a Comment

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>