What Is a Staging Site & How To Create a Shopify Staging Site

In web development, a staging website is a private copy of your actual website, where you can test design tweaks and new features. Rather than pushing updates directly to a live website, developers use a staging site for testing and revisions until they’re ready to show their work to a live audience. Think of it as a sandbox, a lab, or a private dress rehearsal.

Shopify stores don’t come with native staging environments, but there are a few workarounds, including creating a duplicate theme, creating a development store, or using a third-party staging app. Shopify has also expanded its built-in testing tools with rollouts, which helps store owners schedule theme changes and run A/B tests on themes.

Learn more about the benefits of using a staging site for your ecommerce store, including how to create a staging site in Shopify and how to incorporate the rollout feature into your staging workflow.

What is a Shopify staging site?

A Shopify staging site is a private website testing environment where you can review updates or redesigns without affecting your live store. A critical update, such as a new product image section, could hurt website conversions if the site doesn’t function properly as a result of the change. 

A staging site simulates a live site so developers and stakeholders can experience it as a shopper would, so that you can spot layout and functionality issues before real users do.

Because Shopify doesn’t offer a built-in staging environment, you can use a combination of built-in and app-based workarounds to test changes.

Theme duplication creates a second version of your existing theme, allowing you to make design edits. Creating a development store supports testing integrations, new functionality, or new apps, and staging apps mirror the entire site’s data. Development stores are only available for Shopify Partners; it’s free to sign up. 

Shopify has also expanded its native testing tools. SimGym is a first-party app built by Shopify that uses AI shoppers to simulate real buyer behavior on your site. 

“You can point it at an existing theme, and it’ll give you recommendations for what works, or what is broken in,” says Smriti Chopra, product marketing lead at Shopify. “Merchants are using it to test out new themes and find flaws with their existing themes.” 

You can use SimGym either as a jumping-off point on your existing site to understand what changes to make or as a quality assurance (QA) layer after you push changes live to your duplicate version. Simgym only works on live sites, not on development draft sites.

Rollouts is a centralized system for managing, scheduling, and testing changes to your site. For example, you can schedule theme changes to live at a specific date and time for a flash sale or seasonal launch, or test new hero copy with a portion of your audience first. Rollouts is available on the Basic plan or higher, and you must have the new version of Shopify Markets activated on your store to use it.

Development vs. staging vs. live sites 

Web development takes place in three main arenas: development, staging, and live. First, code is written on a development website, then it’s pushed to a staging site for QA, and finally, the live site is updated for all users. 

Development site

The development site is a sandbox where developers write code and bring ideas to life. It’s usually a local environment accessible only to the development team. This stage involves adding images, text, videos, and code for custom functionalities, like interactive product filters. While some initial testing happens here, the development environment is typically unpolished.

“Development stores are usually used for testing, and you wouldn’t push things live. Your buyers won’t see anything that’s happening on the development store, and you would still have to make those changes in your live store,” Smriti says.

Staging site

After development is complete, code is published to a new staging site. This is your dress rehearsal, where all kinks are worked out as if in front of a live audience. 

Staging websites live online, typically on a staging domain that uses a staging site URL like staging.yourwebsitename.com. On Shopify, this would be your duplicate or development site.

“Staging is something that’s internal only,” Smriti says. “Your buyers don’t see any of that experience.”

Be sure your staging site is not indexable—meaning you’ll discourage search engines from displaying it in search results. You can do this quickly by adding a few lines of code. Consider making the staging site password-protected if it has information you’re not ready for customers to see, such as a coming sale or proprietary numbers from an internal database.

Once the staging site is live, stakeholders review it and provide feedback. The code then goes back to the development site, where developers address any concerns and push changes to the staging site again. This process continues until all stakeholders approve.

Live sites

A live site is the final, public-facing version—also called the production environment, production site, or prod for short. 

“Production is anything visible to your buyers, where an actual person can go to your site and make a purchase,” Smriti says. 

This is where the curtains open to the public and updates are visible to all users. They can make purchases, engage with your content, and interact with your brand. Once a change is live, everyone can access it, which is why thorough QA in the staging phase is crucial.

Why use a staging site for your Shopify store?

Site updates can inadvertently disrupt the user experience, which is why testing in staging is an important part of the website development and maintenance process. 

“The main benefit is testing any big changes you’re making to your store,” Smriti says. “And sometimes you want to do end-to-end testing. You made one change. How does that impact everything downstream throughout the checkout cycle?”

A staging site helps:

• Test elements without affecting the user experience. Experiment with designs and new features without degrading your customers’ user experience.
• Catch bugs before public roll-out. Find errors like cart issues, non-functioning buttons, or broken product images.
• Test integrations without disrupting the site. Test third-party integrations like APIs (application programming interfaces) or shipping calculators without affecting the live site.
• Collaborate with stakeholders. Invite various teams, designers, and stakeholders to review and collaborate on revisions.
• Simulate the user experience. Experience the site just like your customers will, letting you find shortcomings in the shopping experience. This is a more complete simulation than simply using interactive design files in a tool like Figma.
• Test website performance. Are your updates slowing your site? A staging site lets you test the impact on technical performance, which can also have an impact on organic search rankings. 

3 ways to create a staging site on Shopify

• Duplicate your theme
• Create a development store
• Use an app

Standard Shopify websites don’t come with a staging site, so you’ll need to create one. There are three ways to do it:

Duplicate your theme

The easiest way to create a staging environment with a standard Shopify account is to duplicate your theme, which contains the visual and structural elements of your store, not any backend settings like apps, checkout, or inventory. 

It’s a quick setup process that only takes a few clicks. You also don’t need to install third-party apps because your staging environment will be built into Shopify’s admin panel. 

This option is best for design changes like layout tweaks, updated copy, or seasonal redesigns, but it doesn’t serve as a testing environment for integrations or functionality changes, such as updates to checkout settings. 

“A duplicate theme only works on that specific theme,” Smriti says. “It doesn’t interact with other parts of Shopify.” 

Here’s how to create a staging site in Shopify by duplicating your theme:

1. Go to Online Store > Themes in your Shopify admin panel.

2. Under Current Theme > Actions, select Duplicate.

3. You now have an identical copy of your live theme. Edit it freely without affecting the live site. You can click Preview to generate a staging instance.

4. Once you’re finished testing, you can make any necessary changes on your live site. 

Keep in mind that you’ll need to manually add the elements you’ve already put on your existing site to your live site.

Create a development store

Creating a development store using a Shopify partner account is the best option for functionality changes, including custom code or third-party integrations. A partner account lets you build a full store for testing.

Partner accounts are designed for developers, designers, and agencies who build and manage stores for clients. They’re free and give you access to a development store, allowing you to mirror everything about your main site—including the website’s design and functionality—in a private environment. “Think of it as a draft versus a live store,” Smriti says.

“Most larger merchants use a development store because you want to see how different parts of your store are working with one change that you make,” Smriti says. For example, a pricing tweak can affect cart logic, shipping prices, and integrated apps. In a development store, you can catch these downstream effects before a customer does.

Here’s how to create a staging site by using a development store:

1. Sign up for a Shopify partner account.

2. Go to Stores > Create Store.

3. Select Development as the store type.

4. Name it something like “staging-yourwebsite” so it’s easy to distinguish from your live store.

5. Add products, install your theme, and configure all the settings to mirror your live store. Back up your store using CSV files to transfer products, customers, and orders in bulk, and you can back up your theme by downloading it from your Shopify admin.

Now, you can simulate the full user experience without risking your actual site. 

Although Shopify development stores are free for testing, they have some limitations. You can only install free and partner-friendly apps and can only generate test shipping labels, for instance. 

If you want to test additional apps or create functional shipping labels, you can set up a new paid store on a Basic plan. Just like if you duplicated your theme, you’ll need to manually copy your website elements onto your staging site. 

Use an app

Sometimes, manually duplicating your website may lead to missing pieces, so using a staging app can ensure an exact copy—especially if you have a complicated theme.

Some staging tools like Duplify (which offers a limited free plan) let you create a staging environment that replicates your entire site. You can then test existing pages and products before going live. 

Rewind Staging is a similar app (with a free trial) that includes theme backups, so you can revert to the previous version if something goes wrong. Just head to the Shopify App Store and search for staging apps to get started.

Here’s how to create a staging site by using Rewind Staging:

1. Install Rewind Staging on your live site from the Shopify App Store.

2. Choose your live store as your Source Store.

3. Install Rewind Staging on your development store.

4. Choose your development store as your Destination Store.

5. Copy the key from your Source store to your Destination store to associate the stores.

6. Choose the information to copy over to the staging site, so it mirrors your live site.

7. Check Continuously for copy changes to maintain synchronization between both stores.

8. Click Begin task to start the copy.