A child theme is a great way to customize your WordPress site without having to worry about losing your changes when a new update is released. It will give you all the styles and functions of your main theme, but the freedom to make tweaks and changes without fear of breaking anything!
What is a WordPress Child Theme?
A WordPress child theme is a theme that inherits the functionality of another theme, called the parent theme. Child themes are often used when you want to customize or tweak an existing WordPress theme without losing the ability to upgrade that theme in the future.
Because a child theme inherits its functionality from the parent theme, you only need to include the files in the child theme that you want to modify. This keeps your child theme lean and makes it easy to update both the parent and child themes in the future.
Why use a child theme?
There are a few good reasons to use a child theme:
- If you make changes to your theme’s code, those changes will be lost when the theme is updated. By using a child theme, you can keep your customizations and still take advantage of the theme’s updates.
- Child themes are a great way to learn about WordPress themes. You can start with a parent theme that already has all the features and code you need, and then experiment with making changes to your child theme without affecting the parent theme.
- If you want to distribute your customizations as a standalone theme, you can do so by packaging your child theme along with its parent theme.
How to create a WordPress Child Theme
There are 3 methods of varying difficulty depending on which theme you are using and your level of programming knowledge.
Option 1: Download from Theme Author
Many theme authors let you download a prepackaged child theme. I use Astra Pro for example which offers this service. All you have to do is visit their website and download the ZIP file.
Option 2: Use a Plugin
There are various free plugins in the WordPress repository which will automatically create a child theme for you. I’ve never used a child theme creator plugin so can’t vouch for them, but Child Theme Configurator has plenty of installs, good reviews, and had been recently updated at the time of writing. Check my guide to choosing WordPress Plugins here.
Option 3: Manual Creation
Manually creating a child theme is relatively simple. It is really just two files: a style.css and functions.php.
Step 1: Create a Child Theme Folder
Create a new folder with a descriptive name, typically it makes sense to name it themename-child (where themename is the name of your current theme.
Step 2: Create a Stylesheet
The style.css file is where you will add all of your CSS code. This file should be saved in the child theme folder you just created.
To create the style.css file, open a text editor (like Notepad or TextEdit) and add the following code:
/*
Theme Name: My Child Theme
Theme URI: http://example.com/my-child-theme/
Description: A child theme for My Theme
Author: John Doe
Author URI: http://example.com/
Template: my-theme
Version: 1.0.0
*/
/* Start Custom CSS Code */
/* End Custom CSS Code */
Be sure to replace “My Child Theme” with the name of your child theme, “My Theme” with the name of your parent theme, and “John Doe” with your name (or the name of whoever created the child theme). The Template line should match the directory name of your parent theme – if your parent theme is located in /wp-content/themes/my-theme/, then template should be my-theme as well. You can leave the version number as 1.0.0 or change it to something else – it doesn’t really matter what you use here as long as it matches what’s in functions.php (we’ll get to that in a minute). After the closing */ comment tag, you can add any custom CSS code for your child theme.*/
Step 3: Enqueue Stylesheet
You will now need to create a functions.php file and save it in the same folder. This is to ensure that the stylesheets of both the parent and child are loaded correctly, and is also where you will add any filter and action hooks to customise your site.
This is where things can get slightly complicated, as the code required to enqueue the styles depends upon how the parent theme is designed.
In 90% of cases however the following should work:
<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'child-style',
get_stylesheet_uri(),
array( 'parenthandle' ),
wp_get_theme()->get( 'Version' ) // This only works if you have Version defined in the style header.
);
}
*note that you must change ‘parenthandle’ for the name of the parent themes stylesheet.
Step 4: Zip it
You will now want to zip the folder containing the two files so it is ready to upload to your WordPress site.
Install & Activate the Child Theme
Whether you created the child theme manually, with a plugin, or downloaded from the authors of your parent theme the installation process is the same.
Go to Appearance > Themes > Add New and select the zipped child theme folder.
You should now see the child theme listed along with all the other installed themes and you can simply click activate.
Conclusion
A WordPress child theme is a great way to customize an existing theme without losing any of your changes when the parent theme is updated. By creating a child theme, you can make as many changes as you like without affecting the parent theme. Plus, it’s a good way to learn more about WordPress themes and how they work.
The article How to Create a WordPress Child Theme first appeared on woosimon.com