WordPress: If You Don’t Know What a Child Theme is…
You’re modifying WordPress themes incorrectly.
We’ve worked with dozens of clients and built hundreds of WordPress sites. It’s not that our job is to create WordPress sites, but we wind up doing it for many clients. Clients don’t come to use WordPress sites very often. They typically come to us to help optimize their sites for search, social, and conversions.
More often than not, we get access to the site to optimize templates or build out new landing page templates, and we discover something awful. We often find a well-designed, well-supported theme purchased as a foundation of the site and then highly modified by the client’s previous agency.
Editing a core theme is a terrible practice and needs to stop. WordPress developed Child Themes so agencies could customize a theme without touching the core code. According to WordPress:
A child theme is a theme that inherits the functionality and styling of another theme, called the parent theme. Child themes are the recommended way of modifying an existing theme.
As themes become more and more involved, the theme is often sold and often updated to take care of bugs or security holes. Some theme designers continue to enhance their theme’s features over time or support the theme through WordPress version updates. We purchase the vast majority of our themes from Themeforest. Top themes on Themeforest are sold tens of thousands of times and have full design agencies continuing to support them.
When we work with a client, we have them review the themes to see the features and functionality they like. We ensure the theme is responsive on mobile devices and has great flexibility for layouts and shortcodes for customization. We then license and download the theme. Many of these themes come pre-packaged with a Child Theme. Installing both the Child Theme and Parent Theme, then activating the Child Theme allows you to work within the Child Theme.
Customizing a Child Theme
Child Themes are typically prepackaged with the parent theme and named after the theme with Child on it. If my theme is Avada, the Child Theme is typically named Avada Child and is contained in the avada-child folder. That’s not the best naming convention, so we rename the theme in the style.css file, rename the folder after the client, and then include a screenshot of the final, customized site. We also customize the style sheet details so the client can identify who built it in the future.
The Child Theme I developed for Martech Zone from the Jannah WordPress theme. I named the theme Martech Zone 2023 after our site and the year it was implemented and placed the Child Theme in a folder mtz-23. Over the last year, I’ve incorporated custom post types, custom functions, fonts, and a ton of style changes to enhance the theme based on our needs.
You can still create one if a Child Theme is not included with your purchased theme.
How Child Themes Work
If there’s a file in the Child Theme that also resides in the Parent Theme, the Child Theme’s file will be utilized. The exception is functions.php
, where code in both themes will be utilized. Child Themes are a brilliant solution to a challenging problem. Editing core theme files is a no-no and should not be accepted by clients. If you are looking for an agency to build a WordPress site for you, demand that they implement a Child Theme. Find a new agency if they don’t know what you’re talking about.
How to Create A Child Theme
If your parent theme doesn’t have a child theme, you can still create one!
- Create a child theme folder in the
wp-content/themes
directory. - Create a
style.css
file and add your declarations. Your stylesheet must contain the required header comment at the very top of the file.
/*
Theme Name: Martech Zone 2023
Theme URI: https://martech.zone
Description: Custom Child Theme for Martech Zone
Author: DK New Media
Author URI: https://dknewmedia.com
Template: jannah
Version: 1.0.7
License: license purchased
License URI: http://themeforest.net/licenses/regular_extended
Text Domain: jannah-child
*/
The following information is required:
- Theme Name – needs to be unique to your theme.
- Template – the name of the parent theme directory. The parent theme in our example is the Jannah theme, so the Template will be
jannah
. You may be working with a different theme, so adjust accordingly.
- If you’d like your child theme to be easily distinguishable within the themes page, add a screenshot of the theme and export it as
screenshot.jpg
with the following dimensions: 1000px wide by 900px tall. - Enqueue the parent and child theme stylesheets in
functions.php
of your child theme:
<?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.
);
}
- Install the child theme by uploading a zip file of the theme OR adding it to your themes directory via SFTP.
- Activate the child theme.
Child Themes are Critical
You’ve hired an agency to build a site for you, and they’ve implemented a well-supported Parent Theme and a highly customized Child Theme. After the site is released and you complete the contract, WordPress releases an emergency update that corrects a security hole. You update WordPress, and your site is now broken or blank.
If your agency had edited the Parent Theme, you’d be lost. Even if you found an updated Parent Theme, you must download it and troubleshoot any code changes to identify which correction fixes the issue. But since your agency did a great job and developed a child theme, you downloaded the updated parent theme and installed it on your hosting account. Refresh the page, and everything works. Code in a child theme will rarely generate issues unless there are some dependencies on the parent theme and they’ve deprecated or changed the functionality you’re referencing.