This guide will show you how to create a development or staging environment and how to then make your development site live again. We’ll most commonly use the name ‘dev’ or ‘development’, but you can substitute that for staging if that’s your preferred terminology.

These steps use our specialized software configuration which makes use of Plesk control panel and Installatron (1-click web apps) for easy web application management. If you are not hosted with us, but your web host uses these tools as well, then this guide will work great for you too.


Not hosting with us?

Want to make creating a development environment this easy for you too? Switch your hosting to Websavers!


Part 1: Create subdomain

We’ll start by creating a development or staging subdomain. If your DNS is not hosted with us (ie: managed within Plesk alongside your website) then you will need to create the subdomain DNS A record wherever your DNS is hosted.

  1. Login to Plesk and choose the “Add Subdomain” button
  2. You can enter whatever you like for the name. Some suggestions: dev, new, or staging.
  3. Be sure to select the correct parent domain — this should be the domain you’re making a development environment for.
  4. If you wish to customize the document root folder name, go for it! Sometimes we prefer to use ‘development’ rather than ‘dev.<domain>’ as it can be a bit shorter, but it’s up to you.
  5. Press the OK button to save your changes.

Note: If you’re building a new site from scratch using WordPress or another CMS… follow this guide to install the content management system of your choice, and select the development subdomain as the target directory. If you’ll be starting with the old site’s content, then read on to learn how to clone the live site to the development subdomain.

Part 2: Copy the site content to the development subdomain

If your website is not powered by a web app found in 1-click web apps, see the second half of our website cloning guide here.

If you’ve got a web application like WordPress, Magento, or Modx managing your site, use these steps:

  1. Login to Plesk and choose the 1-click web apps (or Installatron) button to be taken to your list of installed applications.
  2. Find your website app in the list. If you do not see it there, learn how to import it into 1-click web apps here.
  3. Clone your app using the button with the two side-by-side arrows pointing down. More details on this process here. Your destination for the clone will be the new subdomain you created in Part 1.
  4. If you see the option to inform 1-click web apps that the clone will be a development copy, go ahead and check that box — this will allow you to use the sync tool to easily sync changes from development to live.

And that’s all there is to it! You’ve now got yourself a development environment located at the subdomain URL you specified in part 1. Your login credentials for your app will be identical to the ones you used on the live site.

You should now lock down the development site so as to prevent indexing by search engines. Here’s how to prevent indexing with WordPress.


Once your development is completed and you’d like to make your changes live, proceed with the following steps.

Go-Live Prep & Tips

There’s a few things to note about development sites:

  • If you have not updated any content (posts, pages, etc) on the live site while the site is under development, then the best way to roll out the new site is to sync it or clone it again: see below for details!
  • If you have only edited the files that run the site, such as WordPress or Magento theme files, and *not* anything that adjusts the database (such as theme settings and/or changes in Customizer), then when you’re done making your changes to the development environment, you can use the sync tool and deselect all database tables, ensuring it will only sync the files. Many themes (at least for WordPress) come with an option to export and import their settings, so you may also be able to move the settings from your dev site over to the live site without ‘interrupting’ the live database of posts, pages, products, orders etc.
  • If there has been new posts and pages published on the live site while you’ve been working on the dev site, then syncing the data from dev to live will overwrite that new content. To avoid the loss of data, you’ll need to first sync the new content from the live site to the development site to make your dev site ‘complete’ and then sync the entire dev site over to the live site. More details in our app sync article linked below.
  • If permalinks/page URLs have changed during development when the dev site goes live, you will want to ensure you either rename all the new page URLs to the original value OR create 301 redirects for each one that has changed. This is necessary at bare minimum for SEO purposes. Details on creating 301 redirects here.

How to make your dev site live

If your website is not powered by a web app found in 1-click web apps, see the second half of our website cloning guide here.

  1. In Plesk choose the 1-click web apps (or Installatron) button. In most cases you’ll find this on the right side of the page that contains your list of domains hosted under the account.
  2. Option A: Sync the data from dev to live
    1. Click the wrench button to manage its settings, then click the sync button (round arrows).
    2. Select the files and database tables you wish to sync and click the sync button at the bottom of the page.
    3. More details on this process here.
  3. Option B: Remove live & clone dev to live
    1. Click the curved arrow button to complete a backup then choose the X button to remove the live app.
    2. Find your development application install in the list of web apps
    3. Clone your development app using the button with the two side-by-side arrows pointing down. More details on this process here. Your destination for the clone will be the live domain as we are copying the site from development to the live URL.
    4. If you get an error like “! An instance of wordpress already exists in this directory”: this means you didn’t remove the app (ie: you need to complete step 1).

Not hosting with us?

Want to make creating a development environment this easy for you too? Switch your hosting to Websavers!

About Jordan Schelew

Jordan has been working with computers, security, and network systems since the 90s and is a managing partner at Websavers Inc. As a founder of the company, he's been in the web tech space for over 15 years.

1 Comment

  1. Phil Cheney on October 19, 2018 at 9:31 am

    Very good article!
    It is good to see best practice (development seperate to prod) encouraged by a hosting company!

Leave a Comment