Read all of the other posts in our series on Creating Azure (hosted) WordPress Websites without knowing php or MySql!

Problem:

A new WordPress blog site (hosted on Azure PaaS) had become bloated with images uploaded directly to the website’s Media Library after only 20 posts. WordPress automatically adds in 3 versions (various resolutions and a thumbnail) of each image, as do some themes and plugins, so the wp-contents/uploads folder was overloaded by at least 400%! When we needed to move the website to a different location & subscription, the native WordPress ‘Export/Import Contents’ did not work reliably enough for such a large number and size of image files. A website Restore operation doubled the size of the websites next backup. Initially we tried using various WordPress plugins to clean up the bloated mess before doing the website migration, but that didn’t get us far – and caused more problems.

Solution:

Convert the WordPress website to using cloud based storage slimming down and speeding up the website. In this case, we migrated the existing images videos and other website uploads to an Azure Blob Storage container.

Overview:

  • Get a copy of the wp-contents/upload folders of images and other uploaded media, downloaded to local machine.
  • Move the images to an Azure Blob Storage container with ‘public-read only’ access
  • Change hyperlinks to images and other uploads in all current posts/pages
  • Delete unused images etc out of the wp-contents/upload folder
  • Optimize database

Steps:

  1. Download a copy of the media (images, videos, etc) in the wp-contents/upload folder of the WordPress website to local computer using one of the following methods.

A. Use Azure Kudu to quickly download the folder. (How to access Azure Kudu):

B. Access the wp-contents/upload folder via FTP (you will need to set up a new user credential and password in Azure to do this):

C. We chose to use the Chrome Extension “Image Downloader” to access all of the media files from the blog, since there were only 20 blog posts. We didn’t want to collect all of the additional sizes of WP generated images in the wp-contents/upload folder that would need to be sorted through before uploading to Blob Storage. Plus, we were not going to be using the WordPress directory structure that all the media files were in.  Instead, we created folders (locally) named after the BlogPost titles and downloaded the images/media from each of the posts into these folders locally:

2. Create a Blob Storage Container in Azure, set to Public Access – Anonymous Read Access (for uploading the new blog folders of media into):

3. Using Microsoft Azure Storage Explorer (MASE) drag the blog folders of images into the new blob container:

4. Within the blog posts, we began by manually fixing the hyperlinks to the images and then switched to temporarily using the Velvet Blues Update URL plugin to change ALL the hyperlinks to images in a few seconds!

5. After checking that the images were now being delivered from the Blob Storage, we went back into Azure Kudu and deleted the WordPress Upload folder contents, slimming down the website size!

6. We optimized the database after the deletion, using the installed Optimize Database after Deleting Revisions plugin.

Now, when writing a new blog post, we save the images locally, drag them into a new blog post ‘folder’ in MASE and then just paste the MASE hyperlink URL to the uploaded image, into the blog post. No images are sitting within WordPress, (no more multiple sizes of images being produced within the WordPress upload folder) and with the new relative URL addressing of images, if we move the website to a new domain, no changes need to be made in any image hyperlinks, since the images are being delivered from Azure Blob Storage. The exported xml Contents file of WordPress data contains no images, and resolves quickly when imported into a new website.

Read all of the other posts in our series on Creating Azure (hosted) WordPress Websites without knowing php or MySql!