It’s never a good idea to make “live edits” to your WordPress website when you want to make big changes such as adding a new theme.
The solution is to setup a staging site using a subdomain so you can make you changes, tweak everything, and then port it back to the live site once it’s ready.
Take A Backup
Anytime you go messing with your file structure, you always want to take a full backup of your account incase something goes wrong.
While we do take nightly backups at Name Hero (as long as your account isn’t over 100K inodes/20GB of space) you still shouldn’t substitue these for your own backups.
There are many different ways to go about this, but the best in my opinion is to take a full cPanel backup.
You do this by going to cPanel -> Backup -> Download A Full Website Backup
If this isn’t an option, you can always manually download all the files using a FTP program such as Filezilla and then download the database backup from cPanel -> Backup.
Regardless how you go about it, you NEVER want to skip this step.
Setup Staging Subdomain
Once your files are safe and secure it’s time to setup a staging subdomain.
You do this by going into cPanel -> Subdomains and creating one.
I recommend something like “staging.yourdomain.com” and leaving the other values default:
Once created you may need to wait a bit for the DNS to propagate. Following these instructions may speed up the process, or you may just wish to use another browser window.
Copy Your Existing Files
WordPress has two parts: files and database. They work together to produce your website.
You first want to copy over all your existing files to the subdomain you create.
You can easily do this by navigating to the directory where WordPress currently resides (most often your public_html): cPanel -> File Manager -> public_html
Once here you want to select all the files and folders (left click at the top, hold shift, and left click at the bottom).
You then want to click the “Copy” button on the top menu:
And then enter the location of your staging subdomain and click Copy File(s):
Copy Your Existing Database
Once the files have been copied it’s time to copy over your existing database.
You need to know the database name so you may want to check your current wp-config.php file for that name if you don’t already know it.
Then go to cPanel -> PHPMyAdmin -> Click On Your Database:
Then click on the Operations tab at the top -> and enter a new database name under Copy database to and click Go:
Once completed, you need to click on the “Options” table of the staging database and change the siteurl and home values to reflect the staging subdomain:
Finally, you need to re-assign the database user to have permissions to work inside the staging database.
You can do this by going to cPanel -> mySQL Databases and then adding the user with all privileges:
Congratulations! At this point, you’re ready to goto your “staging” WordPress admin (i.e. http://staging.yourdomain.com/wp-admin) and begin making your edits.
How To Re-Import Your Website
Once you’re finished up editing your staging site, you can easily re-import everything by following the same steps outlined above, but in a bit of a different order:
- Backup everything (you can remove the original backup)
- Copy the files from the staging website to the live website
- Edit the “Options” table (in your new database) to reflect the live domain (i.e. http://www.yourdomain.com vs. http://staging.yourdomain.com)
- Remove the staging subdomain / original database to keep your file structure clean
- You’re all set!
Notice there is no real need to re-import the database, you can simply make the “staging” database the new one.
Step-By-Step WordPress Staging Tutorial
I’ve filmed a complete step-by-step tutorial for those that wish to follow along with me:
I know some of our customers like to use WordPress plugins to accomplish this; and that’s fine if you can get them to work.
Personally, I’ve always been really cheap, and hate to pay for other services when I can do it with a couple clicks inside of cPanel. I’ve also run into timeout errors which can be extremely frusterating when trying to move large amounts of data in the browser.
If you have any questions, please feel free to comment below!