Historically, WordPress users have used child themes to customize the look and feel of a WordPress site. A child theme is a theme that inherits all of the qualities of a parent theme, and extends the functionality of the parent theme.
What is a child theme?
A child theme is a WordPress theme that inherits all of the qualities of another WordPress theme. The primary parent theme can be a commercial theme, one you’ve developed yourself, or any one of the free themes in the WordPress.org theme directory. And yes, you can create a child theme with Kadence as the parent theme.
Do I need a child theme?
Most users do not need to use a child theme when using Kadence. For simplicity and ease of use, Kadence has been developed to be customizable via the WordPress Customizer. If you need to add a function or custom filter we suggest using the code snippets plugin.
When do I need a child theme?
There are two situations when a child theme is necessary.
1. Custom theme functionality or styles. There are advanced theme custom changes that need to be implemented and are not possible via the Customizer or by adding code snippets. These types of customizations would be used when you want to override certain parent theme functionality by copying files to the child theme and editing them. Typically this would happen in the styles.css file or the functions.php file.
2. Custom PHP-based page templates. If you want to create a custom PHP-based page template, you need to use a child theme. You can add the page-template-name.php to the child theme, and it will automatically register as a template option for your pages. You need to use a child theme instead of adding so that your templates are not removed with a theme update.
3. Custom plugin functionality. Sometimes, a site owner might want to deeply customize plugins like WooCommerce. To do so, the site owner would need to override the plugin’s files. While this can technically be done using a custom plugin, the most common way is to use a child theme.
For a deeper look at when and why you might want to consider child themes versus the WordPress Customizer, we have a blog post that explores this further.
Changing your design with a child theme
If you’ve already developed a site using Kadence and later realize that you need to apply styles or functionality using a child theme, you will need to re-apply anything done in the customizer to the child theme. Customizer settings are theme-specific. When you switch, you will have to either re-apply your customizer settings.
An easier way is to export the settings prior to applying the child theme, then importing those settings. Follow these steps:
- To export settings, head to the Customizer, then click Import/Export. Export the settings. A file will be downloaded to your hard drive that will say something like “kadence-theme-export.dat”
- Add the child theme.
- Head to the customizer, then click Import/Export. Go to Import and find the kadence-theme-export.dat on your hard drive, then click “Import.”
Creating a custom child theme
To create a child theme, you’ll create a separate directory under wp-content/themes/ at the same level of the parent theme. Typically it will start with two files, style.css and functions.php, but you can also add many other customizations to a child theme that you would like. There are a number of plugins that will create a child theme for you based on the current active theme. You can remove these child theme configuration plugins once the child theme is created.
You can download an example Kadence Child Theme using the button below:
How to Install the Kadence Child Theme
We have an example child theme available if you’d like to go that route. Download an example Kadence Child Theme from here. In your WordPress admin go to Appearance > Themes > Add New > Upload Theme. Choose kadence-child.zip from your computer and click Install Now.
Click Activate. Congratulations! You have successfully installed and activated the Kadence child theme.
Load child theme style.css file.
If you want to have the child theme enqueue your child theme style.css file you can navigate to the functions.php file of the example child theme, at the top you will see:
/**
* Enqueue child styles.
*/
function child_enqueue_styles() {
wp_enqueue_style( 'child-theme', get_stylesheet_directory_uri() . '/style.css', array(), 100 );
}
// add_action( 'wp_enqueue_scripts', 'child_enqueue_styles' ); // Remove the // from the beginning of this line if you want the child theme style.css file to load on the front end of your site.
Remove the // before the add_action, and your child theme style.css will be enqueued.