Monday Masterclass: Setting up a Staging Environment for WordPress Websites

In this Monday Masterclass, we’ll be showing you how easy and fun it is to set up a staging environment so that you can start experimenting like mad on your website!

Staging is what we call an environment that we create where we can experiment and test our website before it goes live so that your active site is not affected. It allows you to fix things like bugs and plugin conflicts. 

Staging has several other advantages, like speed, for example. if you’re using a local installation on your computer, it makes working on WordPress super-fast, because you won’t be relying on your internet connection. 

So if you’ve always wondered how, or felt that it might be too complicated, this Monday Masterclass, we’ll be showing you how easy, and fun it is to set up a staging environment.

So let’s get started with staging. 

Staging — Getting Started

First, we should clarify the main or practical difference between an online environment or a live site, and a local environment or staging site. Let’s say you’re developing a new medicine or drug. The best place to develop it would be in a laboratory, where you have complete control of the environment and materials. Later, once we’ve got it working, it’s ready to go to its first trials, where we test the drug on subjects. When it comes to website building, the local environment or staging site is our lab. It’s where we have the highest level of control that we could hope for. The online environment or live site is more like the trial phase. It’s where the environment is less predictable and offers more realistic and practical variables.

There are many ways to create a staging environment.
Several major hosting platforms like WP Engine or SiteGround offer services that create an online staging site where you can try stuff out on-site before publishing it. You could also use a plugin such as WP Staging or WP Stagecoach, to do the same thing. 

Today we’ll be setting up a local staging environment, to test our sites in the comfort of our personal computer, using Local by Flywheel.

Installation

Most of us here at Elementor use Local by Flywheel, because it’s simple to use, it’s WordPress dedicated, and it’s good and reliable. It is a little heavy, but our designers and website builders have no complaints so far. We can create both a local and online environment using Flywheel’s hosting features and easily move our data back and forth between them.

To install the plugin, you have to go to Local by Flywheel’s website, downloaded their free application and install it. It launches automatically and there’s a nice introduction to the tool.

Now that we’ve installed the plugin, the next thing to do would be to upload our site. 

Backing Up and Cloning

We’ll be uploading one of Elementor’s latest templates, the portfolio site template. The first step is to back up the site with all its pages, data, plugins and themes. There are some great plugins out there, such as UpDraft and BackUp-Buddy that can do all this. We prefer to use BackWPUp

After the installation, you’ll need to set up a job. To do that go to the BackWPUp tab, select Add New Job and name it. You can easily reduce the archive name string by removing the hour, minute and seconds. Make sure that your backup is stored in a folder. 

You can use the default settings or read through the lists of options and decide what you want or don’t want to back up. Bear in mind that it would probably be best not to back up unnecessary data that will take up space and slow us down. There’s no point backing up things like the themes or plugins that we’ll never use on the site, so it’s best to just mark them to be excluded from the backup. 

Make sure that you choose the option to store your backup in a zip file, run the application and that’s it. Once you’ve finished creating a backup file, go into your backup library and download it. Then we’ll take the downloaded file, drag and drop it into the Localwindow and watch as it automatically loads up our backup.

Now we have a backup of our entire WordPress account installed on our Local staging environment. 

Yes, It’s This Easy

One thing we would suggest is that you go to the SSL tab and make sure that under Certificate, the local bypass URL is trusted. We do this so that when we click on the Admin button, Local launches a tab in our browser with an exact copy of our WordPress account.

The dashboard is exactly the same so that we can make changes, repairs, all within a kind of isolated environment here first without risking anything happening to our live version of the site.

In the advanced settings, there is the blueprint option. It’s very similar to Elementor’s option to save and load designs as templates or global widgets. It’s a very helpful way to provide a basic setup with all the settings and plugins that we routinely use in an instant. 

Conclusion

We hope that having seen how simple it is to set up a staging environment for your WordPress sites, you’ll start using it and gaining from all its advantages. Once you get used to working this way, it’ll become second nature.

In our next masterclass, we’ll learn how to upload the new, corrected version of our site and make it live. It’s not at all a difficult procedure, but we felt that it deserved a masterclass dedicated to it. 

As always, we hope that you enjoyed this and found it interesting and inspiring. Of course, we’d appreciate any comments and criticism you may have, and any advice you could suggest for other users. After all, our goal is to be the best at helping others excel in their craft.

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

you might also like

Liked This Article?

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

Comments

7 Responses

  1. It seems that creating a staging requires an extra elementor license. Is this true?
    I am not able to use a single site license.

  2. A shame that the license could not include one staging and dev site if the domain is the same. But the staging or dev site is on a subdomain.

  3. Tried local by flywheel. Liked the premise of staging but Flywheel did not like my PC. So tried Xampp instead. I have to agree with Luke, It’s a shame Elementor’s license does not include a staging or development site for the same website. Woocommerce and SSL create so many headaches with staging it becomes a real headache. Testing Woocommerce and a payment gateway on my staging site breaks my live site! Frustrating!

  4. I’ve tried Local by Flywheel on 4 different PCs, and all of them hated it. I actually had to reformat one bc it screwed up things so bad on the registry. DesktopServer is 100x better and works flawlessly.

Leave a Reply

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

Want to learn how to build better websites?

Join 877,316 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.