How to Update a WordPress Theme and Keep Custom Tweaks

There are plenty of ways to upgrade a WordPress theme, but it’s easy for them to end up with lost data, so you need to know how to prevent that. “Hold it. I haven’t customized my site yet. I don’t need this article.” Actually, yes you do; preparing in advance is the only way to assure a truly seamless transition. If you have already customized your site, don’t worry. It’s not too late.

Here’s the short of it: most amateur developers just go into their site’s stylesheet and start rearranging things. That’s fine, until you update and all of your painstaking customization disappears. In fact, if you customize your website without considering how updates will affect it, you’re in for a world of hurt. Before you consider not updating your site and making it target practice for hackers the world over, follow a few of the tips below to integrate customizations into your update process.

WordPress Frameworks

The most common, and most popular solution to this is the Genesis Framework. If you’ve ever read a WordPress blog or tutorial, there’s a good chance you’ve seen a developer breathlessly raving about it (checkout Ren’s full Genesis review on our blog).

Genesis is like a theme, but more. True to its name, it could be described as the barebones template on which many themes are built, with all of them coming in the form of child themes that build an “exterior” over the framework. With Genesis, you can both change and update your themes as much as you want without losing a single detail of your customization. It boasts quite a few other desirable features as well, and is well worth checking out. It’ll currently set you back $60.

Another alternative is the Total WordPress Theme Framework which uses a similar approach Total includes options for child themes in addition to an easy to use custom CSS field in the admin panel that you can use for adding styling tweaks to your theme. However, if you don’t have the budget for it, or have found another theme you like and don’t plan on giving it up, there are still alternatives.

WordPress Plugins

There are a whole host of plugins that can help you ease the update process. Most of them are of designed to use before you’ve started to customize, but if you already have, they might be helpful in the future.

The WP Template Overrides plugin will let you quickly override any template. If you don’t feel like doing all of the above, you can use a plugin called One Click Child Theme to do it from the WordPress dashboard, offering the best of both worlds.

WordPress Child Themes

The most common way to make stable customizations – and the most recommended one – is with a child theme. To clarify, a child theme is a lot like a Photoshop layer or an animation cel: a transparent style sheet that lets you non-destructively make changes. Not just cosmetic changes, either – it’s even more important to put important modifications to the site’s essential functions in a child theme.

Modifying your site’s functions.php file is one of the worst things you can do before an update, as the loss of an important functional component can essentially pull the support beams out from under your website. So, include functional changes in the child theme, too. It might help to make multiple ones to avoid having to dump too much information into a single one. In case you need a refresher, they’re fairly simple to create. After that, you only need to include the child theme things that you specifically wish to change.

First, create a new folder in the wp-content/themes directory to hold it. Give it the same name as the parent theme, but with “-child” tacked to the end (you can really call it anything you want but by naming it in this way if you ever have multiple child theme’s you know what they are for). In the folder, create a file called “style.css.” After that, the style sheet has to start with the following code:

/*
Theme Name: Total Child
Theme URI: http://totalwptheme.com
Description: Total WordPress theme example child theme.
Author: AJ Clarke
Author URI: http://totalwptheme.com
Template: Total
Version: 1.0
*/

Any of the entry fields can be changed as you see fit, but be sure to keep the theme name and template. The template is the parent theme’s directory name and if the template name is missing or incorrect then the child theme will not show up.

Next you want to create a new empty function.php file where you will add code so your child theme knows to include the main stylesheet of your theme. In this functions.php file paste the following code:

<?php
// Load parent theme stylesheet
function total_child_enqueue_parent_theme_style() {
	// Dynamically get version number of the parent stylesheet (lets browsers re-cache your stylesheet when you update your theme)
	$theme   = wp_get_theme( 'Total' );
	$version = $theme->get( 'Version' );
	// Load the stylesheet
	wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css', array(), $version );
	
}
add_action( 'wp_enqueue_scripts', 'total_child_enqueue_parent_theme_style' );

If you look at the code you will see what it does is it loads the parent stylesheet but also it includes the parent theme version number. This is very important but not a lot of people do it. The reason to include the parent theme version number is so whenever the parent theme updates if there has been any changes to the parent theme stylesheet then caching plugins, CDN’s and browsers know they need to update the file. This will help prevent any “broken” CSS when updating your parent theme.

Moving Current Manual Edits to a Child Theme

Now, if you’ve already made your site and customized the parent theme incorrectly and you don’t have several free hours to sit around moving code from one file to another, you can always back up the current version of your site onto a child theme. Once you’ve made the child theme folder, simply add copies of the files you’ve changed to it, then replace your WordPress theme with the one in the repository.

It’s not a perfect fix, but it should work. The trick is to make sure you don’t back up anything that hasn’t been modified, so you don’t end up accidentally overwriting the new code that the update will install with the old code. So you still need a thorough knowledge of what you customized – you can’t just copy things wholesale. It might even help to go through the files and remove as much code that isn’t yours as possible.

Backing Up Your WordPress Website

First, back up early and back up often. WordPress stores everything you’ve ever written or uploaded in their database, and they can suffer malfunctions for plenty of reasons. It’s very easy to lose an entire site to a server failure or corrupt database. Fortunately, backing it up only takes a few minutes.

There are a bunch of ways to do it. First, you can simply copy the files to your computer using FTP Clients or Unix Shell Skills. You can also use WinSCP to keep a “mirror” on your desktop that updates with your site.

Or, there’s a laundry list of free automatic backup plugins, as well as premium options. Here at WPExplorer we use VaultPress, and in the past we have used Solid Backups – both of which are great options for creating and maintaining regular backups of your website (in addition to the daily backups provided by most managed WordPress hosting plans).

Finally, cPanel, Direct Admin, Ensim, Plesk, vDeck and Ferozo all have unique ways to back up sites hosted with them. Comprehensive instructions for that can be found in the WordPress Codex. In a worst-case scenario, when you lose something you really need, you can contact your host. Most hosts back up their sites, but it can be a pain to get the data back from them.

Test Your Changes

Finally, you can upgrade manually or automatically. With manual upgrading, you can test the changes to see if they ruin your site or not. WordPress treats two versions of the same theme as two different themes. Meaning, if you have GenericTheme V1 and GenericTheme V1.1 in your wp-content/themes folder, they’ll be treated as two different themes. This means you can have multiple versions of the same theme installed on your site. At the very least, you can use this to switch between your old, customized version and your new one, so you have a reference should you choose to rebuild it from the ground up with child themes.

Conclusion

The prospect of losing the customizations you worked so hard on can be daunting, and the update process can seem like it railroads you into that. But, with child themes (or plugins, or frameworks) and a little foresight, it doesn’t have to be. Do you have any other ideas for making regular updates to WordPress sites without losing customization? I’d love to hear about them in the comments!