This article is part of a series created in partnership with SiteGround. Thank you for supporting the partners who make SitePoint possible.
Are you thinking of making changes to your site? Perhaps an update or a redesign?
Before you jump in head first, you should know there is a quicker and safer way to do that.
Enter website staging.
A handful of hosting companies offer website staging to their clients and this article aims to unveil all the greatness that is website staging and why they are a game changer for not only designers and developers, but everyday site owners.
What is Website Staging?
A staging site is essentially a clone of your website that is actually independent from your live site that visitors can see. It has the same settings, same software, and same hardware as your live site but is safely placed in a staging area while you work on it. This staging area can be thought of as a sandbox or demo site that can be altered for any purpose while having no effect on your live site.
When you are satisfied with the changes you have made, then this clone site can be pushed live with the click of a button at any time. The staged site will essentially overwrite or become your live site.
Why is Website Staging Important?
Website staging is a key feature in any great hosting package because it allows you to make changes to your website without interrupting your live site. This means no downtime while making changes, so you can keep on engaging your readers and selling products. This also means you won’t take a hit on your SEO ranking because search engines won’t be indexing the staging copy of your site.
Website staging is important not just to keep your site operational at all times but also to test out site changes before making them live. Installing a new plugin or theme? That’s a perfect time to test it on a staging site. Making routine updates to your WordPress themes or plugins? Another great scenario to use a cloned site. Making a staging site a part of your website maintenance schedule is definitely a best practice that will pay dividends in the long run. It will prevent downtime from faulty plugins or theme updates being incompatible with your unique site features.
Another key feature of website staging is the ability to do site redesigns on the fly without any site interruption. You or your designer can create a quick clone of the site in the staging area and make all the necessary changes without having to go through the arduous process of downloading all the files, plugins, themes, etc. and setting them up on a new site. That process can take hours. With a staging site, you are making changes in a matter of minutes. Once everything is complete, and you’re satisfied that the changes look good and function properly you can simply click a button and push that site live for your customers to see.
How Can You Use Website Staging?
While the exact staging process may differ with each hosting provider, you can rest assured they all work in a similar fashion. Here’s a breakdown of the standard step-by-step process of website staging:
1. Navigate to your cPanel or WordPress dashboard where you will find an option for ‘Staging’.
2. Create your staging site by selecting the website you wish to copy and select the option to stage which may read as “Create Staging Copy” or some other variety.
3. Select if you want to password protect this cloned site in your staging environment. This matters because if you don’t do this, Google and other search engines will start indexing the staging copy and can show your site visitors and unfinished site. The indexing of an unfinished site can also negatively affect your SEO.
4. Make your changes by clicking on the link or button provided by your hosting provider which will take you to this staging site you’ve just created. Usually, your website’s URL will read normally except it will have a string on the front to signify it is a staging environment. As an example, it might read “staging1.website.com”. Now you are safe to download any new themes, plugins, or just simply update your existing features.
5. Push the staging site live. This process will essentially overwrite your current site and let all your site visitors see your new site with all the changes you just made. Some hosting companies will offer an ‘advanced’ push to live option which will allow you to basically soft test the new changes without overwriting and erasing you previous site forever. This way you don’t break your site with incompatible changes and updates. As a workaround if your hosting company doesn’t have this option, you can restore a backup version of the site to fix it.
That’s it! You can’t make it much simpler than that. If you run into any unknown prompts or messages along the way, we would suggest simply typing your hosting providers name into any search engine followed by the word “staging” to find detailed instructions on how to proceed.
If your site is small, this entire process can take a matter of minutes; especially if you are only updating plugins or performing routine maintenance. If you have a large site and are doing redesign work, then the process can take considerably longer for creating cloned site, making changes, and pushing to live.
Does your hosting company offer website staging?
Is so, then days of ‘cowboy coding’ on a live site and hoping everything works out are over. Now that you know the basics of website staging, you can venture into major website changes and routine site maintenance with confidence.
If your hosting company doesn’t offer website staging, then it might be time to shop around. Our partner, SiteGround, offers free website migration and includes staging environments in all hosting plans. Their WordPress staging feature makes a copy of your live website in case you need to restore it. All SiteGround hosting plans now come with up to 65% off for SitePoint users.
Do you have any questions about staging or helpful stories to share about your staging experience? Please share them in the comments below.
Jump Start Git, 2nd Edition
Visual Studio Code: End-to-End Editing and Debugging Tools for Web Developers
Form Design Patterns