How to Keep Your WordPress Staging and Live Sites in Sync

In a recent post, I showed you how to easily set up a staging site for WordPress on cheap hosting. If you followed the steps I outlined, you’ll have been able to set yourself up with a staging site you can use to test updates to your site, without paying for expensive hosting with staging options included.

But how do you manage your staging site so it’s as close as possible to the live site? After all, it’s not much help testing your updates on your staging site and then implementing them in your live site if the two sites aren’t the same.

In this post, I’m going to show you how to do just that.

I’ll show you an easy way to do it using the Snapshot Pro plugin. My aim is to make sure that this process isn’t daunting and that anyone could follow it, whatever their hosting and whatever their level of experience.

It’s important to note that this method can only be carried out with V.3 of the plugin. If you have V.4 installed, you can download V.3 from the changelog.

Note: If you’re an advanced web developer, you’re probably better off using a more complex process, involving making changes locally and saving to a version control system like GitHub, deploying your Github repository to your staging and live sites, and using something like Vagrant to keep the databases in sync. If that’s you, I recommend following this guide. But if you’re getting started, read on!

First, let’s start by what this will involve.

What You’ll Need to Sync

To do this, you’ll have two things you need to keep in sync:

• The files (uploads, plugins, themes etc.)
• The database

The approach you’ll need to take to these will be slightly different, because of where you’ll be adding them in the first place.

The Syncing Process

Syncing from Live to Staging

Your database will constantly be updated in your live site, as you add new content. So you’ll need to sync your database content from live to staging.

You’ll also need to sync your uploads folder from live to staging, as you’ll be adding content to it whenever you upload a media file and attach it to a post or page.

Syncing from Staging to Live

As you’ll be testing plugins, themes and settings in your staging site, you’ll need to sync these to your live site after you’ve tested them and found that they work. This will include your plugin and theme files, WordPress itself, and the wp-options database table.

The Syncing and Testing Process

This gives you a three stage process whenever you need to test anything on your site:

1. Sync your database content and uploads from your live site to your staging site. At this point the sites will be in sync.
2. Test any new or updated plugins or themes in your staging site, as well as any WordPress updates. Test changes to settings, widgets, the Customizer etc.
3. Assuming you have no testing problems, sync your settings and your files (themes, plugins, core files – but not uploads) to the live site. You may prefer to simply run the updates on your live site instead if that’s all you tested, especially with a WordPress update as that will be quicker than copying all those files across. I’ll walk you through this.

This means you’ll need to create a snapshot in each of your sites:

• In the live site, a snapshot of the database, plus the contents of the uploads folder.
• In the staging site, a snapshot of the wp-options folder and all theme and plugin files.

Make sense? Good! Let’s get started.

Important note: This will only work if you do ALL your testing and updates on your staging site and all your content creation on your live site. Don’t be tempted to circumvent your system!

Before You Start

I’m assuming that you’re working with a new staging site, so your files are already in sync and you haven’t changed any settings in your live site since you created your staging site. If you have, you’ll need to edit the staging site or go through the staging site creation process again to make sure everything’s in sync.

You’ll need the Snapshot plugin installed on both sites.

Setting up the Snapshots

The first thing to do is set up the live to staging snapshot

Creating a Snapshot of the Live Site

Assuming you’ve already got Snapshot installed on both sites, go to Snapshots and click Add New.

Firstly give your snapshot a title and a useful description:

Scroll down and select which folders you’ll include, which is just the uploads folder:

Now scroll down further and select all of the database tables:

 

Now specify where your snapshot will be stored. As this isn’t your full backup it can simply be stored on the local server. Finish by clicking Create Snapshot.

You’ll now have this snapshot in your snapshots for your live site:

Creating a Snapshot of the Staging Site

Now repeat this process for your staging site, with a few tweaks:

1. Give it a useful title and description again.
2. Select the themes and plugins folders instead of the uploads folder.
3. Select all database tables again.

You now have your two snapshots set up and ready to go.

Now it’s time to run the sync.

Syncing the Live Site to the Staging Site

First, you need to sync your live site’s uploads and database to your staging site.

1. Go to the Snapshots screen in your live site and find your syncing snapshot.
2. Run it immediately by clicking run now.
3. Wait for the snapshot to run.
4. When it’s finished, in the Archives column next to the snapshot’s name, click on the view link.
5. This will bring up a list of  backups from this snapshot:

Under the most recent archive (which should be in the last few minutes), click the download link. This will download a file to your computer.

Next you’ll need to copy this downloaded zip file to your staging site. Open your FTP client and copy your snapshot zip file (that you downloaded) to the wp-content/uploads/snapshots folder in your staging site.

Now open your staging site and go to Snapshots > Import. Click on the Scan/Import Snapshots button.

The plugin will look for any snapshots in the snapshots folder and let you know what’s there:

 

It will import your new snapshot so it’s available for you to restore.

Now go to the All Snapshots screen in your staging site:

You’ll see both snapshots listed: the one you already created on this site, to sync back to the live site, and the one for importing from your live site. It’s really important that you give the two snapshots unique titles so you can tell which one’s which.

Before you import your snapshot from the live site, make a quick backup of your staging site. Run the snapshot you’ve already created (surely you have?) to back up your entire site. Just in case. And if you haven’t set that up, do so.

Now it’s time to import the database and uploads from your live site. Under the live site sync snapshot (mine is called Snapshot – sync from live site to staging), click the restore link.

You will be taken to the most recent archive using that snapshot, i.e. the one you just imported:

Check the date is correct (it should have today’s date and a time in the last few minutes) and then click the restore link under the archive’s filename.

This will take you to another screen where you configure any tweaks. Leave everything as it is, then scroll down and select the theme you want to activate:

 

Finally, click the Restore Snapshot button and wait for the plugin to work its magic. You’ll get a success message when it’s finished:

Do Your Testing

Now you’ll have a staging site that’s synced with your live site. It’s time to do your testing.

Carry out any testing you need to – updates, edits to themes and plugins you’ve written. etc. Check everything works before moving on to the next step.

If your testing includes testing an update of WordPress itself, you’ll need to update WordPress in your live site before doing the sync. Do that in the normal way (assuming the update didn’t result in any errors on your staging site).

Sync the Staging Site to the Live Site

To finish the process, you’ll need to sync the wp-options table and any plugins or themes you’ve updated or edited back to your live site.

Note: If you’ve changed any of the content or uploaded any images you’ll have to create an extra snapshot in your staging site to include all of the database tables and the uploads folder as well as the plugins and themes folders. Do that then follow these steps in the same way, using that snapshot instead.

The process is almost identical to sync back to your live site, so I’ll summarise it:

1. Run the syncing snapshot in your staging site.
2. Find the most recent archive using that snapshot and download it.
3. Upload the zip file to the wp-content/uploads/snapshots folder in your live site.
4. Go to Snapshot > Import and click Scan / Import Snapshots to import your snapshot.
5. Go to All Snapshots and run the snapshot you’ve got backing up your entire live site (this is even more important for the live site – don’t skip it).
6. Now run the restore for the snapshot you imported.

All done! You’ll now have a live site that’s fully up to date with all of the testing you did on your staging site. Give the site a final check to be sure everything’s working ok and you’re finished.

Syncing Your Staging and Live Sites Makes Testing More Accurate

You now know how to keep your live and staging sites in sync so that you can be sure that you’re testing on a staging site that accurately reflects your live site.

If you don’t so this, there’s a chance that something could work in your staging site but then not work in the live site, because of the two sites not being identical.

Follow these steps and you’ll have a testing regime that’s thorough and efficient.