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

Author: Aaron

Aaron Snowberger is an experienced web developer, graphic designer, and educator in ESL and computer technology. He holds a Bachelor's degree in Computer Science, Master's degree in Media Design, and professional certifications for React (JavaScript) development, and as a Google Certified Educator and Trainer. Aaron is passionate about helping new learners discover the joys of technology, and has presented across the country at multiple local, national, and international conferences in both the ESL and web development fields. His most recent talk was given at the 2019 JSConf (JavaScript Conference) in Seoul on September 3, 2019. (https://2019.jsconfkorea.com/en/tutorials)

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: