Monday Masterclass: From Staging to Live Site

In this Monday Masterclass, we’ll be looking into ways of pushing or moving your updated WordPress website from staging to a live site, without losing any data!

Going from a WordPress staging site to a live site has never been easier!

Staging is imperative to the upkeep and maintenance of website, removing the risks of testing new plugins, updates, trying out graphic and animated content, things that could harm, crash, and potential kick our site offline.

In our previous Monday Masterclass we saw how simple it was to set up a staging site, but that’s only part of the staging process. Pushing our staged site, taking our updated website with all it’s changes and tweaks, and placing it in place of our live (or production) site is just as important, if not more so.

For the purpose of staging, we need to establish two types of WordPress websites or if you like two groups of Elementor users, each defined by the type of content used on the site:

  • Owner Generated Content – Websites that rely solely on the content that we, the site moderators, provide. Also known as Moderator Generated Content, or Brand Content.
  • User Generated Content – Websites that rely, completely or to a certain degree, on user data. This includes data such as information from forms or orders placed by users, as well as uploaded files, images, comments, etc.

The reason we need to make this distinction is that we need to know whether or not we should be concerned about data that was added to our live website, — while we’re working on the backup-version of our site, — in the isolated staging environment.

Pushing From Staging to Live Site: Owner Generated Content

* Note: This process will overwrite any user generated data not appearing on the Staging site, from the Live site (including comments, orders etc.).

If we’re the only people inputting data to our site, we can avoid adding any data while we’re working on updates and changes, and push the updated version of our updated site in much the same way that we would a brand new site.

Staging Local Flywheel Masterclass WordPress

If this screen looks familiar, it should, because it’s exactly where we left off in our last Masterclass.

As you may recall, we created our local staging environment by uploading a full backup of our live WordPress site, into an environment that we had created on our own computer, using Flywheel’s Local app. There are other ways to do this using Bitnami, or XAMPP, but we found this was to be the simplest and therefore most efficient.

For the purpose of this masterclass, we added a menu and a header to help make a practical distinction between the appearance and functionality of the new (staged) version of the site, and the older (live) version.

Once we’ve finished updating and testing our site, we’ll want to upload our new version from the local environment to the live site. The simplest way to do this by using a migration plugin.

We prefer to use the most popular among them, the All-in-One WP Migration plugin, and install it on both our WordPress.

Step 1: Install All-in-One WP Migration on both Local, and Live WordPress environments

Install the All-in-One plugin on our WordPress installation the same way as we would any other plugin.

Go to the WordPress dashboard of our Local Staging site, and in the Plugin tab, click ‘Add New’.

In the search-box search for All-in-One WP Migration, download it then install and activate it.

Once the plugin has been activated, the ‘All-in-One WP Migration’ tab will appear on the left menu bar of the WordPress dashboard.

Repeat this process to install All-in-One WP Migration on the WordPress dashboard of your Live site.

Step 2: Creating an Export File From the Local Version of Our Site

Staging WP Live site Export Migration
Essentially, in this next step we’re creating a backup of our local site. 

On the WordPress dashboard’s left menu bar, under the All-in-One WP Migration’ tab click on the tab and select ‘Export’.

In the Export window you will find that the Advanced settings allow you to export certain data rather than the whole site.

We suggest exporting the whole site. To do this, click on the Export button and select the File option from the dropdown menu.

When the plugin has completed preparing the export file, a window will appear with the option to download it. Click to download the backup file to your computer.

Step 3: Pushing the Backup to Live Site

With the backup of our Staging site downloaded, we’ll go to our Live site’s WordPress dashboard. In the left menu bar, we’ll click on ‘All-in-One WP Migration’, but this time we’ll select ‘Import’, and in the Import window, we’ll click on Import, and from the dropdown menu, we’ll select File.
We’ll locate our exported file and click on ‘open’. The file will upload to WordPress.

Once the upload has completed, a warning will appear to remind us that continuing with this process will overwrite everything on our live site (including comments, orders etc.)

As we are only following this process for websites that rely solely on owner generated content, we’ll click on ‘Proceed’.

The plugin will now install our new site, overwriting the older version. Depending on the size of our site, this may take a few minutes or much longer.

Bonus: Only Pushing UPDATES From Staging to Live Site (Similar to Git)

 

When it comes to our other category of WordPress and Elementor users, those who rely on data that comes from an external source, there are two ways of pushing updated site from the staging environment to the live site without risking the loss of any data.

As aforementioned, our main concern with data that comes in the form of users subscriptions, purchase orders, even comments etc., is that they will have continued to register on our live website, while we were busy working on the isolated staging version.

One method is a complex procedure that involves messing around with individual files and folders through an FTP or SFTP interface, using tools such as C-Panel. As such we felt that we would risk readers misunderstanding the tedious steps and accidentally steamrolling their live site.

That said, it is extremely important to back up your Live site and data before you do anything else, regardless of whatever way you choose to push your site. Remember that it’s always better safe than sorry.

Pushing site changes and updates from a staging environment is a lot safer than working directly on the live site.

How to Backup the Data

 

To do this, you can use the Duplicator plugin, or Migrate DB, even All-in-One WP Migration.

Once our live site is backed up, the second method, the safest and easiest way to push our site is through our website’s hosting service.

There are plenty of WordPress Web Hosting services that also offer staging services, whereby a completely independent environment is created on the hosting server, for us to run all of our tests, and try out new ideas.

These include hosts such as BluehostSiteGround, and even FlyWheel’s premium hosting package includes this option, and of course we’ll be posting links to all of these and more in the show notes below.

BlueHost is the more popular, because they offer their staging service for free.

Then again, you may prefer SiteGround because of their superior quality of service.

This is something that we must decide for ourselves, based on the size of our site, and the volume of traffic. But we also need to consider the revenue that we’ll need to achieve in order to cover our costs, and whether our choice will help or harm our business goals.

Crunching numbers hosting website wp Dan-meyers-unsplash

When we crunch the numbers, we need to aim for maximum income while keeping our overhead low.

This is where we need to be honest with ourselves, because if our website is also our livelihood, then hosting is not one of those places where we want to cut corners, or scrimp and save. If our site receives so much traffic that an hour or two of downtime would jeopardize it, we really need to invest in hosting companies.

Local WordPress Staging

Local Staging, a staging environment on our own computer, has many benefits, chief among them is speed. Working locally we’ll see test results and responses far quicker, making it the perfect environment for huge overhauls and possibly initial builds too.

While host staging is not as fast as local staging, it can still handle changes to graphics and written content, updates, and tests quite nicely, so long as their not too big. It’s ideal for routine testing and updating, especially if the server also provides an option to push your new version to the live site. The drawback is the price tag, as several hosting services charge extra fees for staging. However, this fee includes support which could save a lot of time and money in the long run.

Staging Services

Host sites that offer staging services have similar features that allow us to push the new version of our site from Staging to our Live sites, with minimum effort and zero worry.

On SiteGround, for example, all staging options can be found on the Staging management page, that can be accessed via SiteGround’s version of cPanel. Here users are given the ‘Easy Push’ option to push the entire new site over the old live site, virtually steamrolling it and deleting everything that was there. Alternatively, users can ‘Advanced Push’ which compares the differences between the old and new files, then allows you to select which files to keep and which to overwrite. This solution effectively preserves the data that we’re worried about losing while working on staging sites.

SiteGround staging Push live advanced wordpress site
In Local, once we’re connected to the FlyWheel server (by clicking on the cloud icon in the toolbar on the left), we’ll go down to the bottom right-hand corner where we’ll click on a similar icon that gives us the option to ‘Push to FlyWheel’.

Next, a window appears, allowing us to select or deselect the option to ‘Exclude the Database’, whereby everything except the database (with its new comments, orders, memberships, etc.) will be overwritten.

It’s worth mentioning that Flywheel automatically creates a backup copy of our site, just to be on the safe side.

To run the process, we click on ‘Push to Flywheel’, and as soon as it has finished pushing our site, we’ll get an email to notify us that everything is up and running.

WordPress Staging to Live Site: Conclusion

Looking back over this two-part edition of Monday Masterclass, we’re glad that we decided to tackle the subject of Staging.

It gave us not only the chance to help users who had been asking for advice about staging, but thanks to the wonderful comments and dialogue that the first episode generated, we decided to take this second episode further than planned and clarify some of the issues and interesting points that you raised.

We’ve reviewed several practical ways, used by professional web-builders the world over, to push two different types of WordPress websites from the Local staging or Host staging site to our Live or Production website. Moreover, we discussed why the reasons as to why we should choose one method over the other.

At the end of the day, it is our choice as owners or moderators of our website, as to where and on what we should invest our time and money, a choice that will affect our traffic, engagement and inevitably our revenue.

How do you push from staging to live site? Let us know in the comments if you have alternative methods.

About the Author

Simon Shocket
Simon Shocket
With a background in graphic design and animation, Simon began his writing career in the entertainment industry, followed by a fruitful career in advertising, before moving into hi-tech journalism. Simon also performs with several bands and musical productions. After all, he was born in Manchester, UK, and that’s a lot to live up to.

Share on

Share on facebook
Share on twitter
Share on linkedin
Share on whatsapp

Liked This Article?

We have a lot more where that came from! Join 885,286 subscribers who stay ahead of the pack.
By entering your email, you agree to our Terms of Service and Privacy Policy.

Comments

13 Responses

  1. Thanks for the info guys,

    But how is this different to manually upload all files and manually upload the database (with changing the URLs of course) ?

    Never tried any plugins for that.

  2. Thank you, Simon! I’m in the middle of completely revamping my website using Elementor on a hosted staging site, and not being very tech-savvy, wasn’t 100% sure that all my work on the staging site would, in fact, replace my original site.

    I did find a very useful plugin that I’ve tested to export and re-import Woocommerce orders so I don’t lose that data after pushing staging to live: Order Export & Order Import for WooCommerce by WebToffee. I’m going to look into whether there are similar plugins for post comments and product reviews, as well.

  3. You didn’t answer the question you posed in your title. I was expecting you to actually show us how to publish from staging to Live.
    I was disappointed you didn’t show that.
    -M

  4. Excellent information. However, this is a lot of work.

    Just keep it simple.

    Most Cpanel accounts now allow you to set up a WordPress staging site. When you’re ready, click a button and put it live — no other requirements.

    And if your hosting does not have a Cpanel that does this – find new hosting.

  5. One off-the-topic question. I’m logged in the to site right now, but I still have to fill in the form if I want to comment on this post. Why is it so? Can you just prefill the data for the logged users?

  6. And now my on-the-topic comment, 🙂

    Regarding pushing site updates for the sites that fall into the category where data comes from an external source, there is also the possibility of setting up a Continuous Development environment

    This way you connect your Git host (e.g. GitHub) to your live server. When you push changes from your local environment to the Git host, these changes are automatically propagated to the live site. Also, you have your code saved on your Git host. However, this technique is more feasible for tech-savvy users.

  7. Transitioning pushing dev to live is a complex issue. This post highlights a key area, sites with active databases vs static, but does not address the critical issue of selectively synching staging -> live database changes. For example, changing an Elementor section template would update the database. Even changing options will result in database changes in most cases.

    The post seems to imply some hosting companies’ staging support includes a mechanism for selectively updating the live database in order to ‘push’ the updates. In my experience, this is not the case. Flywheel, for example, only offers a complete database overwrite. There is no merge capability (for obvious reasons).

    As a suggestion, please refrain from promoting certain hosting services.

  8. Good insight –

    I use WP Staging Pro for client sites that I’m not hosting. That takes care of most of the process automatically.

    With hosting I personally prefer WPX Hosting because it’s way faster and more reliable than the budget hosts.
    -WPX has a one-button push to live from the staging environment. The interface is extremely user-friendly.
    Also, SSL, cloud hosting and CDN are included, and their customer service is the best I’ve ever experienced!

  9. >A number of web articles explain how to set up a development site and how to migrate from one server to another. DigitalOcean.com is a good source. The articles explain what to do and why, so the reader has an understanding of the process.
    > Simon’s article’s advice is buy plugins. But he explains very little of what is happening and how it is done.
    > My advice is for a site developer to learn how things work, which is useful information for the times when things do not work. Do not buy plugins to do things you should know how to do yourself.

Leave a Reply

Your email address will not be published. Required fields are marked *

Want to learn how to build better websites?

Join 885,286 Elementors, and get a weekly roundup of our best skill-enhancing content.

By entering your email, you agree to our Terms of Service and Privacy Policy.