Keep your customizations with a child theme

Make the most out of your theme

No matter if you’re using a boilerplate theme with a visual builder, or an expansive built out theme, there may come a time when you want to tweak it to meet your exact needs. The files are available for you to edit, but any changes will be lost upon an update to the theme. But those updates are crucial for security, new features, and other upgrades. Instead of keeping a log of all your changes, you can simply create a child theme instead!

What is a child theme?

A child theme basically calls all the files of the parent theme, except for those that you override. Child themes can be as expansive or minimal as you need. Many people use a child theme simply as an effective way to add extra CSS styles to their site, building custom code into the single style.css call instead of slowing down loading times with inline or spread out styles. Others use it for much more in-depth customization, overriding header files, footer files, or even creating new templates for their pages inside the child theme.

At its core, a child theme only has two crucial files. A style.css file to pull the CSS from the parent theme, and a functions.php file to pull the rest of the files. Even if you’re not planning on huge customizations, it’s often worthwhile to have a child theme ready in case you change your mind, or to streamline small bits of custom CSS.

Creating a child theme

The first step in creating a child theme is to head into your site files, and find the themes folder inside the wp-content folder. Here is where you’ll find all the files for the themes you have installed on your site. Create a new folder here with the same name as the theme you want to use as a foundation, and add a -child to the end of the name.

Inside your new folder, create a file called style.css. At the top of this file is where you’ll define the details of the theme. You can find a list of all available options from the WordPress Codex, but the crucial ones are:

• Theme Name – usually “[Parent theme name] Child”
• Template – the most important – the name of the folder of your parent theme
• Author – your name or company name
• Description – a brief sentence of the purpose of the child theme
• Version – best practice is to start at 1.0.0

There are other options to provide more details for clients or colleagues, but these four are the most important to define.

The final step in creating your child theme is the functions file. In the same child theme folder, create another file called functions.php. At the top of your new file, drop this code:

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

And that’s it! Now when you head to your Appearance > Themes in your WordPress dashboard, you should see the new, shiny Child theme ready to activate!

Customizing a child theme

Now that you have your child theme up and running, you can start customizing it! The two most obvious routes are to add to the style.css and functions.php files. In the CSS file you can add any custom stylings you want. In the functions.php file you can hook into plugins, create shortcodes, and do many other kinds of new features. And best of all, these additions won’t be lost when you update your parent theme, but you’ll still enjoy the benefits of those updates!

You can take this even further though, by copying files from the parent theme into the folder for your child theme. Be sure to create any folders necessary, and nest the files into the same folders as they are in the parent theme. The child theme will look for anything that is overwritten, but only if it’s in the same place in the structure as the parent theme. But let’s say you want to add an extra element or a tracking code to the header of your parent theme. Simply find the header.php file in your parent theme, copy it, and paste it into the same structural place in your child theme folder. Now you can customize this version in the child theme to your heart’s content, without losing the customizations whenever the theme updates.

Of course, none of this is necessary with a totally custom theme. There’s no need to create a child theme when your initial theme was built specifically for you, and the only updates that come down the pipe are from you or your developer in particular!

Need some help customizing your child theme, or want to shift away to a totally unique custom theme? Reach out to us at Mr. WPress for a free quote!

Tags: theme