What exactly is a WordPress Staging Site and How Do You Create One?

The most effective method to achieve this is by using the use of a WordPress staging site (also called a staging environment), which you can make use of to test and implement major adjustments. Therefore, if the modification you implement breaks something- whether that's the addition of a new plugin making changes to code, editing it, or changing themes it won't affect your live site. That means you can continue to make sales and provide an exceptional experience for prospective customers.

What is a staging area?

Staging websites are replicas of your live site that are hosted at a different URL (also known as a test or staging URL). They're usually the final step on the way to develop a website prior to rolling out a brand new website or major changes to an existing site. With a staging website, you are able to try out new functions, plugins and modifications to the design, all without impacting your live site.

In addition, your live store not go down in the event of a mishap You can also use any time needed to test and experiment and not confuse site visitors.

Important elements in a staging site

Your staging space should be as close to exactly the same as your live site as possible however, there are a few important differences.

• The site you are using live will be hosted at "yourdomain.com" while your staging site will need to be hosted under a different domain name (e.g. yourdomainname.staging395312.com).
• The staging area you choose to use must not be visible to the public.
• If you're unsure of how to set your staging web site depending on the configuration of your staging site, you might have to replicate manually specific features of your live environment for instance SSL certifiies, PHP versions, and other server settings.

What changes can I make with a staging site?

If you're fixing a typo or updating a price for a product, or making other small changes to your website the site won't make sense to transfer your live site to a staging environment and then making the necessary changes before deploying and again. Make the minor adjustments on your live site and continue with your daily routine.

It is recommended to use a staging site when making these modifications:

• Manually updating themes, plugins and WordPress core
• The addition of new plugins
• The ability to add significant functionality is possible with existing plugins
• The process of making major design and text modifications to pages and posts
• Redesigning your site entirely
• The switching of payment gateways, or some other important changes in functionality

Where is a staging site is it hosted?

The staging environments are typically created by a web hosting company -- typically the same one that hosts your live site. Create a one-click staging site through your host and build it manually using the help of a web hosting company or even use localhost on your computer.

These are some advantages and drawbacks for each type of stage site:

One-click staging

Pros:

• It's quick and easy to deploy from your hosting company's admin panel.
• It often includes live deployment via one-click.
• The system automatically creates an intermediate URL, meaning there is no need to purchase an additional domain to run tests or play around with DNS subdomains.
• It's typically part of your hosting package There aren't added charges.
• It updates the roots URLs within the staging site's database.
• It's accessible for collaborators.
• Search engines are automatically disincentive from crawling content.
• It makes use of a secure connection via a secure https:// network connection.

Cons:

• A few hosts make use of plugins to facilitate one-click stage deployment that interfere with the theme you have chosen or the other plugins that you use for your site.
• It is not your responsibility to have influence over the methods used to create the staging area.

Manual staging on a web host

If you don't have hosting that supports one-click staging, or aren't happy with the way that the hosting company sets up their staging platforms it is possible to set up your own.

Pros:

• You have control over how you copy your website live onto your staging area.
• You may choose the test site that you want to test on your own.
• It is possible to choose any hosting company you want.
• It's easy to share with collaborators.

Cons:

• It is more time-consuming to setup and deploy the live website.
• It is possible that you need to cover additional hosting and the cost of domain registration.
• Your SSL certificate might not be automatically enabled for your test domain.
• It is more susceptible to errors.
• Your hosting provider may not allocate enough resources to rapidly deploy an existing staging site into live sites. This happens most often with shared hosting plans.
• It is necessary to manually verify "Discourage websites from indexing this site" within WordPress' SettingsSettings - the Reading.
• Then, you'll have to make your staging website inaccessible to the public through a maintenance mode, or privacy plugin.

Staging with localhost

Localhost staging can be an excellent option for those who are used to developing on your own and don't need to connect with a team of people for testing. However, it has quite several drawbacks which must be considered, though.

Pros:

• You don't have to connect to the internet in order to develop or test specific aspects of your website -you are able to work while on a flight, on your commute in the subway or even camping out within the desert.
• The site you are using may load more quickly than on your web hosting provider, which makes development and testing faster.
• Your test site is secure and not accessible to the public by default.
• There are no additional costs for hosting or domain registration.

Cons:

• Localhost configuration could be time-consuming, and it's an extremely complex process. If you're planning to launch a staging site quickly and have never developed locally before, this option shouldn't be your first choice.
• It can take longer to create and deploy on your live site as opposed to a single-click staging website.
• It is necessary to manually include an SSL certificate.
• Moving to a live website can be more prone to mistakes.
• You won't be able to test payment gateway transactions as well as notification emails or any other services connected via API without the internet connection.
• It's not very accessible to colleagues.

How to set up an area for staging

In this section, we'll cover how to set up a staging web site using your host's API, manual as well as by using a plugin in an environment hosted by the host. The steps above should be able to translate into creating a staging website using localhost. If you're new to using localhost, Jetpack has an article with good recommendations for localhost development tools.

Before starting

No matter how you organize your staging area be sure you're equipped with:

• A staging domain name linked to your web host. Certain hosting providers may allow you set up new instances of your site on test URLs that they have. Other hosting companies may insist the use of your personal purchased domain name. If you're using a URL you own, make sure you connect it to your hosting account through the DNS entries.
• Login details for your hosting control panel. These details are usually identical to the username and password for your hosting account. If you're unsure, check with your hosting provider.
• Secure File Transfer Protocol (SFTP) credentials. These can be found in your hosting control panel. If you're unsure where to find them, ask your host's support. The details you will need include:

• Host (your live server's IP address)
•   Username  
•   Password  
•   Port code  

If you do make use of a plugin for copying your website live to a staging environment it is possible that the transfer will be a bit rocky. It is best to be ready to copy your site over manually. To do so you'll require an SFTP program like:

This example will be using Filezilla, but most SFTP clients function in a similar way.

The process of setting up the WordPress staging site with your hosting

Many hosting providers offer single-click staging, specifically in the managed WordPress plans. This is the most straightforward way to set up a staging site because your hosting company handles all the chores for you. The host can also help you should you run into any problems.

The exact steps you'll need to take will vary based the provider you choose, so check out their documentation for the specifics you need. In this case, we'll be setting up the staging area using Siteground.

In your Siteground account, open the Websitestab and then click Site Tools underneath the website you wish to duplicate. Go to WordPress - Staging.

In the Choose WordPress installation dropdown, select the website you're working on. Next, you must create a title for your staging site and then click Create.

If your files are located beyond the normal WordPress setup -- e.g. the custom JavaScript A box will appear asking if you want to include those in your staging area. Include them if they're a part of your site features or designs. It will be different for every setting. Then, click Confirm.

It's that easy! The staging website from the same area in the control panel, and then push the changes onto your live site in a few mouse clicks.

The process of setting up a staging site with an application plugin

If the hosting service you use does not offer staging services, using a plugin to make a copy of your current site and transfer to a staging system is the most effective option. It's not only more efficient than manual processes, it's less time consuming and results in fewer mistakes. We'll use WP Staging as the WP Staging plugin to illustrate this Other options are Jetpack, BackupBuddy as well as Transferito..

The procedure of each plugin may differ If you choose to choose a different one than WP Staging You'll need to read the plugin's documentation prior to beginning the procedure of moving. Before you do anything, back up your active website!

After installing and activating the plugin, head into WP Staging - Staging Sitesin your WordPress dashboard. In this section, you will be able to choose the sections of your database as well as the documents you wish to incorporate within your staging area. The entire database will be included by default, and this is the ideal choice for the majority of sites.

Then, select Start Cloning. The time it takes to create your staging site is dependent on the size. However, the plugin will inform you all through the process.

When the process is finished, you're good to go! There are instructions on how to access the staging site and sign in with the same credentials that you use on the live version.

You'll require to purchase the the premium edition that comes with the plug-in in order to move changes from staging live. However, if you aren't an experienced developer, and you don't include staging tools as part of your hosting plan The ease of use is probably more than worth the cost.

The process of setting up an WordPress stage site by hand

The following steps are based on a host that uses the cPanel control panel. If your hosting provider utilizes an alternative such as Plesk or an alternative control panel, the process should still be quite similar. If you're not sure there's a good chance you'll find assistance in the help manual of your hosting company or reach out directly to their customer support team.

Step 1: Create backups of your current site.

Make an archive of your live site before you begin copying your website to staging in case anything goes wrong.

Step 2: Copy your file from your live server to your desktop

You'll require an SFTP client along with login passwords. If you're not certain about these, you can ask your hosting company.

1. Log into your web server using your SFTP client. Input the credentials given to you by your host for Host, Username, Password, and Port fields.

1. Go to a directory on your system in which you wish to download your website's content. With the majority of SFTP clients, local files are displayed in the left pane and external server files appear on the right.

1. Open the directory public within your website server (right pane) . This directory is typically referred to as ' public_html" or " the www.' The directory name can vary but you should make sure to check with the hosting company in case you're not sure.

1. Choose all your files in the right pane before moving them over to on the left. It will take some time depending on how many files you've got and the connectivity speed.

Step 3: Export your live site's database

After you've transferred your files from the live server onto your desktop, you'll need to export your database in order to move it into your staging environment. If you attempt to access your staging URL before importing your database, you'll see the message 'error in establishing a connection to the database.'

Unlike your WordPress data files, your WordPress database cannot be accessed via SFTP as well as the cPanel file manager. To access and export the database, use the phpMyAdmin. The site for phpMyAdmin is phpMyAdmin in the cPanel section under databases..

 In phpMyAdmin:

1. Select your database.
2. Click on the Export tab.
3. Select Quick for the method of export Select SQL as the type of file, and then select to go.

The process will create a .sql file onto your PC. Note where this is saved, as you'll be required to install it on your staging web server.

Step 4: Upload the database of your live website to your staging server.

For you to transfer your live site's database, first you'll need to create a new, empty database on your staging server.

1. Within your control panel for hosting visit the "Databases section, and then click MySQL databases.

1. Make a database from scratch. The database will be called 'tutorial_mydb.'

1. Create a database user. Under the MySQL Users section you'll create a new user. Use an individual username (not "admin" -Get imaginative) as well as a secure password.

1. Add the database with the users. Within the Add user to database section, click on the database and user you have created. Then, select Add.

5. All rights must be assigned to the user account and click "Make Changes".

Voila! It's done! You've created a new database into which you can transfer your existing site's database.

5. Modify the wp-config.php file

The wp-config.php file contains vital information about your database. The file links WordPress to essential data, such as the content of your posts, post meta, users, and theme and plugin settings. Your wp-config.php file must be updated with your staging server's database details in order that your staging website is able to communicate with your database.

1. On your computer, find the backup of your wp-config.php file that you downloaded from your live web site. Then, open it in a text editor you prefer, such as the VS Code and Notepador ++.

1. Navigate to the mySQL area of the file. Replace the database information of your current site by those that you have just added.

// ** MySQL settings - You can get this info from your web host ** // /** The name of the database for WordPress */ define( 'DB_NAME', 'yournewdatabasename' ); /** MySQL database username */ define( 'DB_USER', 'yournewdatabaseuser'); /** MySQL database password */ define( 'DB_PASSWORD', 'yournewdatabasepassword' );

Certain wp-config.php files contain also the following lines:

define('WP_SITEURL', 'https://yoURLivesite.com'); define('WP_HOME', 'http://yoURLivesite.com');

If you find these lines in your file then you'll have to alter these lines to the URL for your staging server.

1. Make sure you save you wp-config.php file and add it to your website server via dragging and dropping it over with your SFTP client.

Step 6: Import your live site's database

1. Go to the phpMyAdmin page from your website server. In cPanel, you'll find this under databases..
2. Choose the database you have just created, then click on the Import tab.
3. Select Choose File to open the sql file that you had exported previously.

4. Click on the Go button to start the process of import. Depending on the amount of data in your database it could take a longer to complete the import. Once the import process is complete then you will see all your database tables in the upper left.

Step 7: Edit the root URLs of your database on your site

Now that your data has been import, it is time to update all the instances of your live site's URL by your staging site's URL.

1. Open phpMyAdmin and choose your database.
2. Select your WordPress options table. Tables are usually displayed in the lower left.

3. After opening, you will have the option to select the top two choices. Look under the option_name column to see the names siteURL and home.

4. Double click on the siteurl as well as the home option value in the option_values column. You can change both of these to your staging URL. Be sure to not include a forward slash (/) at the end of the URL.

5. Start your browser, and input your staging site's URL. Add the slash /wp-adminat the beginning and / after it (e.g. https://yourstagingsite.com/wp-admin/). It will take your to the sign-in screen.

Step 8: Clear your web browsers

Permalinks provide permanent URLs of pages and posts on your site, as well as their basic design. Sometimes your post and page links won't function on your staging site in the event that you do not clear your permalinks before. This is an easy process.

1. On your staging website's WordPress dashboard, go to Settings and then Permalinks.
2. Click Save changes. It shouldn't require you to modify any settings.

9. Search for and substitute your live URLs in your database

It's likely that your site has at least a few self-referring links which use the root URL. If you have a staging website it is important to not allow those link to refer to your live version, and it's necessary to search and replace. The safest and most efficient way to achieve this is to use an application. This example is making use of the Better Search Replace plug-in.

Remember: prior to doing any changes to your database, make sure that you create backups.

In your WordPress dashboard:

1. Click here to go to Plugins and Add New.
2. Search for Better Search Replace.
3. Select Install Now and activate.
4. On your WordPress Dashboard, navigate to tools -> Better Search Find and Replace.
5. In your Search forfield by entering your live website URL (e.g. livesite.com).
6. Complete the Replace with field by entering your web server URL (e.g. stagingsite.com).
7. Select the database tables that you'd like to search/replace on. Usually it's only necessary to apply this to the WP_Posts and the wp_postmeta tables.
8. Check Run as dry run?.
9. Click Run Search/Replace. The dry run means that this will make no modifications, however it will display the amount of modifications that are made when you do actually perform the search and replace.
10. Check for the changes. If the dry run has been completed, you will see a number of adjustments. If not, you may need to double-check the URLs. If your URLs are correct but there's nothing else to change it's not necessary to take any further action and you can remove the plugin.
11. If you are looking for changes that need to be made, remove the option to run as dry? option and click Run Search/Replace.
12. Uninstall and disable Better Search Replace. After your search and replace has been done and you've verified that the site is working correctly, you can deactivate and uninstall the plugin.

Stop for a moment and get your cup of coffee. You've completed the manual staging setup and you're now ready to start troubleshooting, experimenting, and trying out!

Test your staging site for errors

However you decide to use to build your staging website It is important to test it in order to ensure that there's nothing amiss throughout the set-up process, and then check it over again once you've made your changes and upgrades. What you can test will differ from website to website, but this is a list of concerns to be asking in the process of testing

Front-end:

• Does the website display exactly as you expect it to on desktop and mobile?
• Are all links working?
• Are interactive elements functioning in a correct manner (e.g. carousels, buttons, accordions, pop-ups)?
• Do you have the ability to submit your the forms? Did you receive the forms?
• Do your Cart and Checkout pages work in a correct manner?

WordPress dashboard:

• Do your dashboard pages load correctly?
• Can you add and edit posts, pages and products?
• Does your site have the ability to be found through search engine crawlers? Visit Settings and then Reading and make sure Discourage search engines from indexing your website is checked.
• Do your plugin and theme pages and settings work?
• Do you have the ability to install new plugins?

Make sure your site is secure and avoid interruptions

No matter which option you select make sure to test significant updates or changes made on your site using the staging area instead of directly testing your live website. Doing so will ensure that your live website is protected from problems from the latest plugins, avoid interruptions due to mistakes or conflicts, and ensure that your users enjoy the same seamless and uninterrupted the experience for users.