You don’t have to be a hardcore developer to benefit from setting up a WordPress staging or development environment. If you add new plugins or do theme customizations, a development environment allows you to experiment without a negative effect on your live site.
Everyone can, and should, use a copy of their WordPress site for testing especially now that it’s so easy to set up (more on that in a minute).
“Development environment” is just a fancy way of saying “a copy of your site.” When you create an exact copy, you can see the effects of any changes before you apply them to your live site. We’ll also use the term “staging” to refer to a copy of your WordPress site.
In professional development circles, there is a difference between a development environment and staging, but for the purposes of this tutorial, we’ll use both terms interchangeably.
Why Do You Need WordPress Staging or a Development Environment?
If your WordPress site has been around for a while, you’ve probably done a lot of customization and experimentation on it. The more plugins you use and the more customizations you’ve made, the greater the chance of a WordPress update or a new plugin installation breaking some, or even all, of your site.
Perhaps you’ve been unfortunate enough to experience that first hand. If so, you probably don’t need any convincing. You realize how valuable a development environment could be.
But even if you’ve never broken your live site, when you experiment with changes, you run the risk of visitors finding broken pages or catching you in the middle of some change that makes the site look or function in a strange way.
What’s even worse is if Google, or any search engine, happens to be crawling your site when something is broken. They can remove the URLs for those broken pages from their index. So a 30 minute period of experimentation can potentially knock you out of a search index for weeks.
Finally, if you are working on website development for a third party, a development environment is a necessity. It allows you to demonstrate changes and updates exactly as they will appear on the client’s site before making them live.
We’re going to cover a couple of different methods for setting up and using WordPress staging. The first is quick and easy, but may not be available to everyone. The second is a manual method that anyone can use.
The First Step for Any Development Environment
I mentioned search engines potentially crawling your live site while you’re testing changes and why you want to avoid that possibility. The same thing applies to your development environment.
You don’t want search engines to find it because they see it as duplicate content. And technically it is since it’s a copy of your live site. Duplicate content is a big no-no in the search engine world, and it can lead to search engine penalties.
When you create a development environment, you want to let the search engines know that they shouldn’t crawl it. You do that with a robots.txt file.
If you are staging in a subdirectory, like https://ggexample.com/staging/, add these lines to a robots.txt file in the root directory of your site:
If you are staging on a subdomain, like https://dev.ggexample.com, add a robots.txt file to the root directory of the subdomain, and set it to disallow crawling of everything on the subdomain:
Normally search engines only look for a robots.txt file in the root directory of the domain. But when you set up a subdomain, a directory is typically created under public_html with its name. Most search engines will obey robots.txt files in subdomain directories.
Method 1: Set up WordPress Staging With Softaculous
If your website uses cPanel and you used Softaculous to install WordPress, you’re in luck. Setting up WordPress staging couldn’t be any easier.
If you have access to Softaculous but didn’t use it to install WordPress, you’re still in luck. You can import your existing WordPress installation into Softaculous with a few clicks.
Log in to cPanel.
In the “Softaculous Apps Installer” section, click the “WordPress” link or icon.
In the “Current Installations” section, click the “Create Staging” icon.
Live Installation URL is the WordPress installation that will be copied.
Choose Installation URL
- Choose Protocol
You can choose HTTP or HTTPS, with or without www. Choose whatever matches the live site.
- Choose Domain
If you have multiple domains, choose the same domain as the live site. You can also select a subdomain if you have one set up.
- In Directory
Enter the name of the directory where you want your development/staging site to be set up. If the directory doesn’t exist, it will be created automatically.
Database Name – you can leave whatever default value is entered here unless you need to name the database a certain way.
Click the “Create Staging” button.
You’ll see a success message.
That’s it. Your staging site is ready to go.
Using Softaculous Staging
When you create a staging site with Softaculous, you log in to /wp-admin using the same username and password as the live site. Make your changes to the staging site, and when you’re satisfied that everything is working properly, you can “push” the staging site to the live site.
“Pushing from staging” means replacing the live site with the version from the staging area. But there are a couple of different ways of doing that.
First, in the “Current Installations” section of Softaculous, click the “Push to Live” icon on the staging site line.
The first method is to use the default options. The default options replace everything on the live site, files, and database, with the versions that exist on the staging platform.
That may sound scary, but the Staging system creates a backup of your live site before replacing it. So if anything were to go wrong, you would have a backup.
Clicking the “Customize” tab will allow you to push only certain database tables. You should only choose this option if you’re sure of what you’re doing and comfortable with pushing incremental or partial changes.
Most of us should use the default options.
According to Softaculous, the “Set this installation as live” button should also push the staging site to the live site. But in my testing, it did not. It did, however, remove the “Push to live” icon from the staging version installation, which essentially made the staging version unusable.
I‘m not sure if that’s a bug or something else that happened on my end. For now, I would recommend avoiding the “Set this installation as live” button.
How to Delete the Staging Site
Since it’s so easy to create a staging site, there isn’t any reason to let it remain active when you’re finished using it. Assuming you only use staging occasionally, of course.
To delete the staging site and database, go to the “Current Installations” section of Softaculous and click the “X” icon on the staging site line.
To completely remove the staging site, leave all of the options selected.
Click the “Remove Installation” button.
Method 2: WordPress Staging Using WordPress Plugins
If you don’t have access to Softaculous, you can still set up a WordPress staging site. It’s a bit more complicated, but if you’ve ever broken a site by making live changes (and I think it’s safe to say that most of us have), you may consider it to be time well spent.
There are several staging plugins available for WordPress. Though like most things in life, the full-featured, easy to use versions come at a cost. Many of the paid plugins have free tiers or versions, and we’re going to use one of them.
It’s called Duplicator.
Before we get started I should point out that while this method works perfectly well, when you push the staging site to live, you are overwriting the live site’s WordPress database. So the potential for mistakes is there.
As always, back up your site and database files before you do anything that’s potentially destructive. If these kinds of things make you nervous, you might consider paying for a professional staging plugin or finding a host that offers the cPanel/Softaculous method.
All right, that being said, let’s dive into setting up a staging site with Duplicator. Here’s what we’re going to do:
- Create an empty database for the staging site.
- Install the Duplicator plugin on the live WordPress site.
- Export a copy of the live WordPress site.
- Install the copy of the live site into an empty directory to create the staging site.
- Make changes on the staging site.
- Export a copy of the staging site.
- Install the copy of the staging site on the live site.
Create an Empty MySQL Database
The method for doing this varies depending on your host. But you need to create a MySQL database name, username, and password to proceed. You can do this by accessing MySQL Databases from cPanel.
The free version of Duplicator will copy your existing database, but it cannot create a new one.
Installing the Duplicator Plugin
Log in to the WordPress admin panel for your live site.
In the left column navigation, mouseover the “Plugins” link and click the “Add New” link.
In the “Search plugins…” box, enter “Duplicator.”
Once you have located the plugin, click the “Install Now” button.
When the plugin has been installed, click the “Activate” button.
Creating a Copy of the Live Website
In the left column navigation, mouseover the “Duplicator” link and click the “Packages” link.
Click the “Create New” button in the upper right corner.
Name the package.
Leave all of the values in “Storage,” “Archive,” and “Installer” as they are.
Click the “Next’ button at the bottom of the page.
The site will be scanned, and you’ll come to a “Scan Complete” page. If all of the checks are “Good” (green), click the “Build” button.
On the “Package Completed” page, click the “One-Click Download” link.
Create an empty directory on your site. This will be the staging directory. Upload the two Duplicator package files to that directory.
Go to the installer file URL.
In this example, I am copying a site from ggexample.com/blog/ to ggexample.com/staging/, so the installer file URL is http://ggexample.com/staging/installer.php
You’ll see a “Step 1 of 4: Deployment” page. The “Archive” and “Validation” sections should say “Pass” (green). Click the “I have read and accept all terms & notices” box and click the “Next” button.
The archive files will be extracted, which will take a moment.
Enter the database name, database username, and password for the blank database you created.
Click the “Test Database” button.
In the Validation” section, “Requirements” and “Notices” should say “Pass” and “Good” (both green).
Click the “Next” button.
An “Install Confirmation” box will pop up. Verify that the information is correct and click the “OK” button.
That will bring you to “Step 3 of 4: Update Data.” Verify that the “New Settings” information is correct.
Click the “Next” button.
The “Step 4 of 4: Test Site” page will open. Click the “Admin Login” button to complete the installation.
Your staging site is now up and running with the same admin username and password as your live site.
Pushing the WordPress Staging Site to Live
Once you’ve made your changes on the staging site and verified that everything is working properly, you can export the staging site.
The steps to import the staging package files to the live site are almost the same as the steps above, but there are some differences (noted here in bold).
- Create and name a new package on the staging site.
- Click the “Next’ button at the bottom of the page.
- If all of the checks are “Good” (green), click the “Build” button.
- Click the “One-Click Download” link.
- Upload the two package files to the live site.
- Copy the MySQL database name, username, and password from the wp-config.php file on the live site.
- Delete or rename the wp-config.php file on the live site.
- Go to the installer file URL on the live site (for our example that would be http://ggexample.com/blog/installer.php).
- Click the “I have read and accept all terms & notices” box and click the “Next” button.
- Enter the MySQL database name, username, and password that you copied from the wp-config.php file on the live site.
- Click the “Test Database” button.
- Click the “Next” button.
- Verify that the “Install Confirmation” information is correct and click the “OK” button.
- Verify that the “New Settings” information is correct and click the “Next” button.
- Click the “Admin Login” button to complete the installation.
Now your live site should be updated with the changes that you made to the staging site.
Notes on Pushing the Staging Files to the Live Site
You may have noticed the warnings that the target directory should be empty except for the two Duplicator package files. You may have also noticed that we did not empty the directory for the live site before pushing the staging site to live.
That wasn’t a mistake or oversight. I did that to minimize the live site downtime during the push from staging.
In my testing, I didn’t run into any problems leaving the WordPress files in the live site directory, but it may be wise to take precautions anyway.
If your WordPress site is in the root directory of your account, download or copy the live site files to another directory for safekeeping. Then, delete all of the WordPress files, upload the Duplicator package files and run the install script.
If your WordPress installation is in a subdirectory, such as /blog in our examples here, you can rename the live directory to /blog2. Then create a new empty /blog directory, upload the Duplicator package files and run the install script.
Back up, Back up, Back up
Whatever you do, back up your WordPress site files and database before you do anything with Duplicator (or with anything else that alters your site or database). You will never regret backing up your website and database files. But I can guarantee that sooner or later you will regret not backing up.
We’ve all been there, which is why I remind you to back up, back up, back up!
There are several WordPress backup plugins that will do the job. You may also want to take a look at Cloud backup services that will automatically back up your website and database every day.
The Cloud backup services vary in cost and complexity. I like DropMySite because it’s inexpensive and it hasn’t failed me once in five years of use.
That’s not an advertisement or affiliate link, just a personal recommendation.
Keeping Your Live Site Safe
Whether you’re developing code or experimenting with a new plugin, using staging for WordPress is a great way to experiment. The ability to see the effect of your changes on a site that exactly mirrors your live site is invaluable.
What kind of changes have you made to WordPress that you could have used a staging area for? How often do you make design or functionality changes to your live site?
Author: Michael Phillips
Michael Phillips is a web hosting industry veteran, helping people make the most of their web presence since 1995.