What is a WordPress Stage Site and How Do you Set It Up?

The best way to do this is by using the use of a WordPress staging website (also called the staging environment) it is a site you utilize to experiment and test major adjustments. So if the change that you make breaks anything -such as the addition of a new plugin making changes to code, editing it, or switching themes -- it will not affect the live website. It means that you'll continue to generate sales and offer the best experience to potential customers.

What is a staging area?

Staging sites are duplicates of the live website hosted on a separate URL (also known as a test or staging URL). They're generally the final stage on the way to develop a website prior to deploying either a new website or making major modifications to an existing website. On a staging site, you are able to try out new plugins, features, and design changes all without affecting the live website.

Your live store not go down if you make a mistake and you'll also be able to take whatever time you need to test and experiment with your customers without causing confusion.

Key components of staging sites

Although your staging area should be as close to the exact model of your live site as possible however, there are a few significant differences.

• Your live site would be located at "yourdomain.com" however, the staging website will have to use a different domain name (e.g. yourdomainname.staging395312.com).
• The staging area you choose to use shouldn't be open to the public.
• Depending on how you set up your staging site depending on the configuration of your staging site, you might need to manually replicate some elements of your live site like SSL certificate, PHP versions, and different server settings.

What kinds of modifications should I implement on a stage site?

If you're fixing an error or updating the price of a product or making minor changes to your site It's probably not going to make sense to transfer your live site to a staging area before making the changes, then deploying it back again. Just make your minor changes on the live website then continue your work.

Use an interim site for these changes:

• Manually updating plugins, themes or WordPress the core
• The addition of new plugins
• The ability to add significant functionality is possible with existing plugins
• Making major design and content adjustments to existing pages as well as blog posts.
• Redesigning your site entirely
• The switching of payment gateways, or other major functionality changes

Where is a staging site hosted?

Stage environments are generally hosted through a web hosting company -- typically the same one that hosts your live site. Create a one-click staging site with your host, build one manually with the help of a web hosting company or even use localhost on your machine.

Below are the benefits and drawbacks to each type of stage site:

One-click staging

Pros:

• It's quick and easy to deploy through your hosting company's administrative panel.
• This usually includes the ability to live deploy with one click.
• The system automatically creates a staging URL, so it doesn't require you to buy a different domain for testing and tinkering with subdomains and DNS.
• It's normally part of your hosting package There aren't additional charges.
• It automatically updates URLs for root in the database of the staging site.
• It's easily accessible to collaborators.
• Search engines are automatically discouraged from crawling content.
• It is secured by a https:// connection.

Cons:

• Certain hosts might use plugins for one-click staging deployment , which may interfere with the theme you have chosen or any other plugins you have that you have on your website.
• It is not your responsibility to have influence over the methods utilized to build the staging area.

Manual staging on a web host

If you don't have hosting with one-click staging or you do not like how the hosting company sets up their staging platforms it is possible to make your own.

Pros:

• You have control over how you copy your live site to the staging environment.
• You can choose the test site that you want to test on your own.
• You can use any host you wish.
• It's accessible for collaborators.

Cons:

• It takes longer to configure and then re-deploy to your live site.
• It is possible that you have to pay extra hosting or domain registration fees.
• Your SSL certificate might not be automatically enabled for the test domain.
• This can be more prone to mistakes.
• Your host provider might not have enough resources available to rapidly deploy the staging site onto live websites. This can be particularly problematic on the shared hosting plan.
• It is necessary to manually verify "Discourage search engines from indexing this website" within WordPress' Settings- reading.
• You'll need to make your staging website inaccessible to the public with a maintenance mode or privacy plugin.

Staging with localhost

Localhost staging is an excellent option for those who are used to developing locally and do not need to work with a large group of developers for testing. There are some drawbacks you should keep in mind but.

Pros:

• It isn't necessary to connect to the internet in order to work on or test certain elements of your site -you are able to work while during a trip, during your commute in the subway or even camping out within desert.
• The site you are using may load more quickly than on your web hosting provider, which makes your development and testing speedier.
• Your test website is private and inaccessible to anyone else by default.
• There is no extra costs for hosting or domain registration.

Cons:

• The initial setup of localhost is time-consuming and an extremely technical procedure. If you're looking to set up a staging site quickly and you've never created locally previously, this should not be the first option you consider.
• It can take longer to setup and then re-deploy the live website as opposed to a single-click staging website.
• You'll have to manually add an SSL certificate.
• When you deploy to live sites, it could be more vulnerable to errors.
• There is no way to check the transactions of a payment gateway notifications emails, payment gateway transactions, or any other services connected via API without an internet connection.
• It's not easy to access coworkers.

How to set up an area for staging

In this section this article, we'll go over setting up a staging site by hand, using your host as well as by using a plugin in a hosted environment. The steps above should be able to translate into creating a staging website on localhost. If you're new to the localhost platform, Jetpack provides an article which contains helpful recommendations for localhost development tools.

Before you begin

However you choose to organize your staging area, make sure that you've got:

• A staging domain name that is linked to your hosting provider. Some hosting companies will let you create fresh instances of your website with test URLs that they control. Others may require to use your own bought domain. If you're using a URL you own, make sure that it's linked to the hosting account via your DNS records.
• Login details for your hosting control panel. These details are usually identical to the username and password for the hosting account you have. If you're not certain, you can check with your hosting provider.
• Secure File Transfer Protocol (SFTP) Credentials. These can be found in the hosting control panel. If you're unsure where they are, you can ask support from your host. The information you'll need include:

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

If you do utilize a tool to transfer your live site to a staging environment however, it may take a while to complete. Be prepared to move your website by hand. For this it's necessary to use an SFTP application like:

In this case, we'll be using Filezilla However, the majority of SFTP clients work similar to Filezilla.

Setting up the WordPress staging website with your hosting provider

Many hosting providers offer one-click staging environments, especially when they are part of controlled WordPress plans. It is the simplest option to establish an online staging website since your host takes care of most of the tasks for you. The host can also help you in case you encounter any difficulties.

The specific steps you'll have to take will vary based upon your service provider. look through their guide for all the details you'll need. In this example we'll create the staging area using Siteground.

Within your Siteground account, log into the Websitestab and then click Website Tools underneath the website you want to duplicate. Visit WordPress Staging.

Within the Select WordPress Installation dropdown, select your site to work on. Next, you must create a title for your staging website and click to create.

If you have files located in a different location than the standard WordPress installation -- e.g. custom JavaScript -- a box appears asking you if want to include those in your staging area. Add them in if they're part of your site features or designs. The exact procedure will differ for every setting. Then, click Confirm.

And that's it! You can access your staging website from the same section of your control panel . You can then make changes to your live site with just a couple of clicks as well.

The process of setting up a staging site with the plugin

If the hosting service you use does not offer staging services in their platform, using a plugin to make a copy of the live website and then transfer it into a staging area is the best option. Not only is it more efficient than manual processes and time-consuming, but it also takes less effort and has fewer errors. This example will use WP Staging as the WP Staging plugin for this example however, other choices include Jetpack, BackupBuddy and Transferito.

The procedure for each plugin is different If you choose to choose a different one than WP Staging it is recommended to review the manual for the plugin before you begin the procedure of moving. Before you start anything, back up your live website!

Once you have installed and activated the plugin, navigate through WP Staging - Staging Sitesin your WordPress dashboard. There, you can choose the sections of your database and the documents you wish to incorporate in your staging environment. All of the options will be chosen as default and this is the right option for the majority of sites.

Now, click Start Cloning. The time it takes to set up your staging site is dependent on the size, but it will also keep you updated all through the process.

Once the process is complete then you're all set! The instructions will be provided for accessing the staging version and sign in with the same login credentials you used on your live site.

It is important to note that you'll need an the premium edition of this plugin in order to transfer changes from staging live. But, if you're not an experienced developer, and you don't use staging tools included in your hosting plan however, the user-friendliness is probably more than worth the cost.

Making the WordPress staging site manually

The following steps follow a host using the cPanel platform. If the host you're using employs an alternative, such as Plesk or a proprietary control panel, the process should still be quite similar. But, if you're not certain, you can likely find assistance in your host's help documents or reach out directly to their customer support team.

Step 1: Create a backup of your live website.

Create a backup of your current website before beginning to copy your site to staging just in case something goes wrong.

Step 2: Copy your documents from the live server onto your desktop

It is necessary to have an SFTP client as well as login passwords. If you're not sure of about these, you can ask your hosting company.

1. Log in to your server's web interface using an SFTP client. Input the credentials given to you by your host for Host username, password, username and Port fields.

1. Go to a directory on your system that you would like to download the site's files. In most SFTP clients, the local files appear in the left pane, while servers from external sources appear on the right.

1. Open the directory public in your server (right pane) . This folder is usually called ' public_html' or ' www. The directory's name may vary but you should check with your hosting provider for clarification if you're uncertain.

1. Select all of the files from the right pane and drag them into in the left side. It will take some time dependent on the number of documents you've got as well as your connection speed.

Step 3: Export your live site's database

After you've transferred your files from your live server to your desktop, you'll need to export your database in order to import it to your staging system. If you attempt to access your staging URL before importing your data, you'll see the error message: 'Error establishing database connection.'

Contrary to WordPress databases, your database cannot be accessed via SFTP as well as the cPanel file manager. For accessing and exporting the database, use PHPMyAdmin. The site for phpMyAdmin is phpMyAdmin within cPanel's Databases.

 In phpMyAdmin:

1. Select your database.
2. Click the Export tab.
3. Select Quick as the export method Select SQL as the format, and select go.

It will then transfer a .sql file onto your PC. Make note of the location the file is stored, since you'll be required to install it on your staging web server.

Step 4: Import your database from your live site onto your staging server.

In order to upload your live website's database, first you'll need to build a completely new unpopulated database on the staging server.

1. In your hosting control panel, go to the 'Databases Section and select MySQL databases.

1. Create a new database. In this case, the database is named "tutorial_mydb.'

1. Create a database account. Within the MySQL Users section, you can make a brand new user. Create an individual user name (not "admin" -be inventive) as well as a secure password.

1. The database should be added with the users. In the Add database user section, select the user and database that you created earlier, and then click Add.

5. Give all rights to the user account , then Click Make Changes.

Voila! Now you have a completely blank database that you could connect your live website's database.

5. Modify the wp-config.php file

The wp-config.php file contains vital information about your database. This file connects WordPress to important data such as post content, post meta users, post meta as well as plugin settings. The wp-config.php file must be updated with your staging server's information about the database so that your new staging website is able to communicate with your database.

1. If you have a computer, search for the backup of your wp-config.php file that you downloaded from your live web site. After that, you can open it with an editor for text you prefer, such as Microsoft Visual code or Notepadand ++.

1. Visit the mySQL section in the file, and then replace the database information of your current site by the ones you created.

// ** 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 also contain the following line:

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

If you find the following lines in your document then you'll have to alter them to match the URL of the staging server.

1. You can save you wp-config.php file and add it to your web server by dragging and dropping it over using your SFTP client.

Step 6: Import your live site's database

1. Log into PHPMyAdmin on your web server. In cPanel it's located under Databases.
2. Choose the database you have just created and then select the Import tab.
3. Click Choose File and locate the sql file you had exported previously.

4. Go to the next page. Go to begin the import process. Depending on the dimensions of your database it might take a little longer to complete the import. When the import is completed then you will see all your database tables in the upper left.

Step 7: Modify the root URLs in the database of your website

Now that your data is imported, you'll need to update all the instances of your live site's URL by your staging site's URL.

1. Start phpMyAdmin and choose your database.
2. Go to the WP_Options table. The tables usually show on the left.

3. Once opened, you should have the option to select the top two choices. Check the option_name column for labels siteURL and home.

4. Double click on the siteurl as well as the home option value beneath the value_options column. You can change each of them to the staging URL. Make sure you don't include a forward slash (/) at the end of your URL.

5. Open your browser and enter your staging website's URL. Add /wp-adminor at the end (e.g. https://yourstagingsite.com/wp-admin/). It will take you to the login page.

Step 8: Flush your permalinks

Permalinks are the permanent URLs for pages and posts on your site and also their design. Sometimes your post and page hyperlinks won't work properly when you are staging your site, in the event that you do not clear your permalinks before. This is a simple procedure.

1. Within your staging site's WordPress dashboard, go to Settings - Permalinks.
2. Click Save Changes. You shouldn't have to change something in the configurations.

Step 9: Search for and replace your live site's URLs within your database

Your website most likely includes at least self-referring links which use the root URL. For your staging site it is important to not allow those hyperlinks to be pointing back to the live version, and you'll have to perform a search to replace them. The most secure and reliable method to do this is with a plugin. In this case, we're making use of the Better Search replace plugin.

Remember: prior to doing any changes to your database, be sure to take backups.

In your WordPress dashboard:

1. Go to the Plugins section and add a new plugin.
2. Search for Better Search Replace.
3. Click Install Now to activate.
4. In the dashboard of your WordPress dashboard, click tools -> Better Search Find and Replace.
5. In the field Search Forfield by entering your live website URL (e.g. livesite.com).
6. Complete the Replace field by entering your web server URL (e.g. stagingsite.com).
7. Pick the databases tables you want to perform the replacement or search. In most cases, it is not necessary to do this to the wp_posts as well as the wp_postmeta tables.
8. Do you want to check Run as dry run?.
9. Click Run Search/Replace. Dry run indicates that it won't make changesbut will show you the number of modifications that are performed when you perform the search and replace.
10. Examine for modifications. When the dry run is done, you'll notice a variety of adjustments. If not, you might need to check the URLs. If your URLs are correct and there's still nothing to be changed the plugin isn't required to change anything else and are able to delete the plugin.
11. If there are changes to make, uncheck the option to run as dry? option and click Run Replace/Search.
12. Deactivate and uninstall Better Search Replace. Once the search and replace process has been done and you've verified whether the website is functioning correctly, you can disable and remove the Better Search Replace plugin.

Stop for a moment and get an espresso. You've completed the manual staging setup and are now ready to begin testing, troubleshooting and testing!

Test your staging site for errors

Whatever method you choose to set up your staging website You should be testing the site to confirm that there's nothing amiss during the setup process before you check it over again once making your adjustments and upgrades. What you can examine will vary from site to website, but this is a list of questions you can ask during the testing process:

Front-end:

• Does the website appear as expected on both mobile and desktop?
• Does every link work?
• Are the interactive elements working properly (e.g. carousels, buttons, accordions, pop-ups)?
• Can you submit form? Are the submissions received?
• Are you have your Cart and Checkout pages work in a correct manner?

WordPress dashboard:

• Do your dashboard pages load correctly?
• Can you add and edit pages, posts, or products?
• Does your site have the ability to be found in search engines? Go to Settings > Reading and make sure Discourage search engines from indexing this site is checked.
• Are your plugins and themes working? pages and settings work?
• Are you able to install the latest plugins?

Secure your website and prevent downtime

Whatever option you decide to go with, test out any significant updates or changes made to your website in an environment that is not directly on your live site. This will help protect your live site from problems from updates and plugins. It will also prevent any delays due to errors or conflict, and also ensure that your visitors enjoy the same seamless and uninterrupted users experience.