10/22/2024 | News release | Distributed by Public on 10/22/2024 05:16
Updated: October 22, 2024
Published: July 01, 2020
One significant thing I've learned in my coding experience is the importance of a staging site. I've witnessed too many novice developers learn the hard way, and I've experienced the discomfort - and even embarrassment - of skipping this essential step.
Publishing untested code can result in confused or frustrated users, disappointed clients, and security vulnerabilities. The good news is that you can avoid this by simply using a staging site.
In this post, I'll explain what a staging site is, when to use one, and how to set one up with Content Hub and WordPress.
Table of Contents
A staging site is a private website environment that lets you edit the content, functionality, and appearance without affecting its live site counterpart. When you alter this hidden website and not your actual site, the user experience of your website remains undisturbed. Once changes are optimized in the staging environment, they can be deployed to your public site with confidence, limiting potential downtime and SEO harm from a faulty live site.
I'm sure none of us want our users to experience glitches, unpolished edits, or insufficient cybersecurity protocols. In order to keep this site isolated from the public, you'll need a private URL that is different enough from the original URL that your visitors can't find it.
Having a staging environment not only helps to prevent many site issues, but it also allows us to experiment with the features and design of our website behind the scenes without interrupting the live site's usability.
I find a staging site an ideal environment to try out innovative apps, test APIs, or troubleshoot potential new features. Using staging sites has become an imperative part of my workflow in designing and maintaining websites, and I highly recommend their use.
Create and customize your own business website with an easy drag-and-drop website builder.
As the name implies, this is the version of the website where the code is developed or created. Whether it's being built by an individual or a team, this version of the website is kept isolated from users. It is the initial environment where the website's design and features are built.
The staging site is a separate copy of your website with completed development that is used to test the code before the changes go live. This site is closer to the final version of the website than the development site and allows for edits to be made privately without disrupting the performance of the live site.
The goal of the staging environment is to test the entire website, including changes and new features. Any errors or issues with the coding should be resolved in the staging site so that everything is working perfectly before being published to the live website.
Production sites are the final released version of the website that your visitors see and experience. Now accessible to end users, with the proper quality control ensured by using development and staging environments, the production site is error-free and user-friendly.
In other words, the production site is the published version of your website with a fully optimized appearance and functionality.
For this post, I'm focusing on the pre-production website environment known as a staging site.
However, for clarification purposes, I'd like to explain that some web design firms and larger company design teams may use other sites in addition to the three versions defined above, or they may call these same sites by alternative names. Here are some examples of that.
In addition to website design, staging is also an important step in software development. With software development, like web design, staging is the design phase where the software is deployed in an environment that closely mimics the production environment.
Software staging ensures each component and service of the application is performing properly and interacting well with every other aspect of the software. Staging is used to test and validate the application, features, fixes, and updates, before it is released for public use.
Though I've already alluded to some of the benefits, I'd like to highlight some additional advantages.
With a staging site, you can:
In other words, staging sites give you the utmost freedom to experiment and troubleshoot, empowering you to create better websites that keep users more engaged.
Here are some of the benefits I find from using staging sites:
Here are some of the possible drawbacks I see to using staging sites:
Though creating a staging environment may require extra time, effort, and resources, in my opinion, the benefits far outweigh the cost. I believe that using a staging site for even minor updates has actually saved me countless hours of troubleshooting.
As I've said previously, I believe using a staging site is important anytime you plan to make changes of any kind to your production site. The extent to which you use it will depend on how much you wish to expand your site, how often your site requires updates, and how comfortable you feel introducing changes to your website. Newer administrators might choose to use their staging site for most changes, while those with more experience might use a test site less frequently and prefer to publish smaller tweaks straight to their main site.
However, at the minimum, I highly advise that you always test major website updates on your staging site before deploying them publicly - especially if many users rely on your website. For example, install major updates to your CMS in your staging area before your main site. Big technical problems can affect your reputation and business, so it's always better to be safe than sorry.
Many hosting providers and even some CMS systems offer tools for creating and maintaining a staging site. Depending on your platform, this process might look and feel slightly different, but I find that no matter which website-building platform is being used, the process of creating a staging site is fairly similar to the steps I've listed above.
I'll share more specific information to help you build a staging site in Content Hub and WordPress below.
The Content Hub allows you to build a brand new site without touching your existing web presence in the content staging tool. This allows you to build safely in a separate staging area and test changes before taking your new design public.
The tabs on the left sidebar menu include the following:
● Unmodified, or existing pages that still need to be modified in the tool.
● Staged draft, or pages you've started to stage but still need to publish onto your staging domain.
● Staged proof, or pages you've published on your staging domain. You'll review your pages here before deploying them to your live site.
● More Tools contains additional tools for managing your site.
You can redesign your site in a few ways with content staging in Content Hub. If you want to modify a page but retain some of the existing content on the page, I recommend the following steps.
Create and customize your own business website with an easy drag-and-drop website builder.
Here are the steps I suggest you follow to create an entirely new page to replace an existing URL on your site.
If you want to create a new page that didn't exist on your website before, I advise following these steps.
Note: When adding a new page to your site, I recommend you review your advanced menus and create a new navigation item for the new page.
Finally, here's how to deploy your staged pages.
To learn more about content staging in Content Hub, see our knowledge base page.
With straightforward and virtually endless customization options, WordPress lends itself to tinkering and optimization. However, since third parties make most WordPress add-ons, one tool might cause another to break.
So, it's definitely a good idea to test any update to your WordPress website before publishing. I recommend setting up a staging site through your WordPress hosting provider. This is because it's best to test in the same environment as your actual website - otherwise, it is possible to miss errors caused by your host.
Create and customize your own business website with an easy drag-and-drop website builder.
Bluehost WordPress hosting plans offer site staging out-of-the-box on its subscription packages. To create a staging site on Bluehost, please use the following steps:
Alternatively, you can click the downward arrow and choose Deploy Files Only or Deploy Database. Be very careful if you choose to copy the database, as this will overwrite the existing information on your live site.
SiteGround is another popular WordPress hosting provider with a staging tool. I suggest the following steps to create a test site with SiteGround.
Staging sites are also included in managed hosting plans through WP Engine. To create one, follow these steps.
The following options will appear. These indicate where you want to copy data or content from and where you wish to copy the content to.
You can choose between the following options:
If your hosting plan does not include staging, I would advise you to consider using the free WordPress plugin WP Staging to stage your content. This plugin duplicates your entire site and stores it in a subfolder of your main WordPress installation.
To create a staging site with a WordPress plugin, follow this guide.
It might take a bit more time and even cost a little extra, but it's almost always a good idea to maintain a staging site in addition to your actual website. A basic testing environment will prevent the instant regret of pushing a buggy update into the world, so keep the business upfront and tweaks at the back.
Editor's note: This post was originally published in November 2021 and has been updated for comprehensiveness.
Create and customize your own business website with an easy drag-and-drop website builder.