Create a WordPress Staging Site on Dreamhost Shared Hosting

These are some of my notes from setting up a WordPress staging site through Dreamhost using the Duplicator plugin.

I recently tried to access a website I’d created for a South Korean start-up over 2 years ago only to find that the entire contents of the web directory had been deleted. Within a day or two of this realization, the CEO contacted me and asked me to “fix” it.

Luckily for me, Dreamhost had updated the site in the last year and had created a complete archive of the site at /sitename.com.old. But, I didn’t want to run into this situation again in the future without a backup, so I decided to create a staging site for it. This was to accomplish 3 things:

  1. To maintain a FULL copy of the functioning website (as it is now)
  2. To teach me how to create a staging site so I can repeat the process with my personal sites
  3. To allow me to make changes to my websites that are not “live” – to test and debug them before implementing the changes on my “live” sites

Thankfully, Dreamhost and the Duplicator plugin make this process pretty painless. Here are the steps I took:

#1 Dreamhost

1. Create a .dreamhosters.com subdomain

Dreamhost provides FREE subdomains on the .dreamhosters.com domain to its customers. This is a recommended location to create a staging site. The following article outlines this process:

Creating a Staging WordPress site – Dreamhost Help

When you create the .dreamhosters.com subdomain, be sure to assign the same user to it as you are using for the original site. This will make the next step much easier.


Assign the same user to the subdomain as you are using for the original site.

2. Copy ALL files to the new subdomain

Personally, I’ve found it much much faster and easier to ssh into my site and copy all the files using the command line (rather than via FTP). For this to work, you’ll need to keep a few things in mind:

  1. Your FTP user needs Shell access (Enabling Dreamhost Shell Access).
  2. The same user needs access to BOTH the original site and the new subdomain so that when you ssh in, you can run the Linux copy command from the root folder.
  3. Now, in a Terminal window, ssh into the site, and run the following command to copy all site contents to the new subdomain.
[server]$ cp -a originalsite.com/. staging.dreamhosters.com

We’re copying the files over NOW because Dreamhost Shared hosting won’t allow us to create and download large archives with the Duplicator plugin. So it’s better to do the Two-Part Install instead of relying on Duplicator for the entire process.

#2 Duplicator

1. Install & run Duplicator on the original site

Dreamhost has a helpful article that lays out this process.

Migrating WordPress to DreamHost using the Duplicator plugin

But, rather than downloading the FULL SITE archive, we need to run the Two-Part Install – downloading only the database archive and installer file.

2. Create a new Database on Dreamhost

Complete step #8 from the previous article to create a new MySQL database on Dreamhost:

Creating a MySQL database – Dreamhost Help

3. Upload & run installer.php on the staging site

Continue the Migration tutorial from step #9. Upload BOTH the archive.zip and the installer.php files from Duplicator to your staging site via FTP. Then, navigate to the installer on your staging site:

http://stagingsite.dreamhosters.com/installer.php

When it asks for your database details, be sure to “Test Database” to make sure you can connect. Then run through the rest of the steps in the installer.

Also remember to “Remove installer files” after logging into your new /wp-admin area (there will be a link).

Review & Resources

Overall, the process of setting up a WordPress Staging Site with Dreamhost and Duplicator was much easier than I’d originally anticipated. Here is a condensed list of the steps and resources covered in the tutorial above.

Tools

  1. Dreamhost hosting
  2. Duplicator plugin

Steps

  1. Create a .dreamhosters.com subdomain (with the same user)
  2. Copy over ALL original site files (via ssh and the command line)
  3. Install Duplicator and run it to archive “Database Only”
  4. Upload the archive.zip and installer.php to your subdomain
  5. Create a new MySQL database in Dreamhost (same user)
  6. Navigate to subdomain.dreamhosters.com/installer.php
  7. Run through the remainder of the steps in the tutorial

Tutorials

  1. Dreamhost’s Migration tutorial
  2. Duplicator’s Two-step Install tutorial
  3. See also: Staging a DreamPress overview for tips on best practices:
    1. Password protecting your staging site
    2. Add an SSL certificate (with Let’s Encrypt)
    3. Transferring changes to your live site

Bonus: Get $50 off Dreamhost’s Unlimited shared hosting plan by clicking this link, or any of the other Dreamhost links above!

Disclaimer: (I will make a small commission if you decide to sign up for a Dreamhost plan using one of these links)

Move WordPress media uploads to a subdomain

I recently decided to move my WordPress media uploads to a subdomain to improve site speed and help keep things organized for better backups. These are the things I did and issues I ran into along the way.

I recently updated my personal homepage, and decided to collect all my writing about code from three other sites that I’d worked on over the years. So, I exported the Posts from each of those sites, and imported the .xml files to my new site in order to shift the Posts to my new homepage. Along the way, I decided to move my new site’s media uploads folder to a subdomain, and I ran into a few problems along the way.

Why move media to a subdomain

There are a couple of reasons for this:

  1. To speed up my site by allowing simultaneous downloads from multiple sources at once (almost acting like a mock CDN)
  2. To keep things organized and make taking site backups easier (by backing up the database and files separately)
  3. To do a “dry run” on a small site before attempting the same thing on a large site I run (400+ Posts)

How to move media to a subdomain

  1. Create the subdomain on your host files.sitename.com for example
  2. Download ALL the old media files from your WordPress /wp-content/uploads folder via FTP
  3. Upload ALL the media files to your new subdomain
  4. Change your Upload folder to the subdomain in your WordPress settings

You may need to type /wp-admin/options.php in the URL bar and scroll down to upload_path and upload_url_path as this menu option is not visible in the WordPress menu.

  • upload_path : directory root for subdomain
    • set it to /home/server_root/sitename/folder
    • Echo the following from an index.php file at the site root to find your directory root path: <?php echo $_SERVER["DOCUMENT_ROOT"]; ?>
    • Mine is /home/server_root/sitename/media
  • upload_url_path : actual URL path for the subdomain
    • Mine is https://files.sitename.com/media

After changing those options, you should see them appear now in the WordPress Settings → Media menu.

  1. Change your Live Image URLs with a database Search & Replace plugin (this is easier than phpMyAdmin). Two good options are:
    1. Search & Replace by Inpsyde GmbH
    2. Better Search Replace by Delicious Brains

(I actually prefer the first one because it seems to run faster (there is no loading bar at the bottom of the screen) and also includes the option to download an SQL backup of your database from the first screen in the plugin – and then import it again if your search/replace fails or causes problems.)

  • Search: http://www.oldsitename.com/uploads
  • Replace: http://subdomain.sitename.com/media

Double check everything is working by trying to upload a new image, and checking your old Posts that had loaded the older images (open a different page or empty the page cache first).

  1. Redirect images that are already indexed by search engines. Do this by adding the following to your .htaccessfile:
RedirectMatch 301 ^/wp-content/uploads/(.*)$ http://img.yoursite.com/$1
  1. Finally, it might be a good idea to create a homepage for the subdomain that directs visitors back to your main site or allows them to search it (otherwise they’ll be met with either a blank page or a 403 Access Forbidden error). Here’s a good article that provides more details, and an example.

Problems I ran into

  1. I have a number of Galleries on my old WordPress Posts, but the way the gallery references images is not with an image URL, but with the gallery shortcode. It looks like this:
[ gallery type="rectangular" link="none" size="medium" ids="31183,31184" ]

So, actually, even when I imported my old Posts to the new site, I didn’t get any of the old galleries showing up because the media IDs which are referenced in the gallery shortcode seem to not be the same on the new site – even if I click “Download and import file attachments.”

  1. When I checked the image code on the old site, it also looked like some of what the site was serving up were some kind of “responsive images.”

One of the themes I wrote before did add support for responsive images, so it seems like those are being served up a bit differently than “normal” images. For example, the URL of some of those images included https://io.wp or something similar – as if being loaded through a default WordPress CDN.

  1. Even after updating and changing everything, the images on my subdomain did not show up inside my Media Library.

Resources