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

This is the first of a 3 Part excerpt from our soon-to-be-released book, “Build Secure WordPress Websites in Azure – without knowing PHP or MySql“.
Part 2: Setup Azure Blob Storage to work with WordPress
Part 3: Using ‘Windows Azure Storage for WordPress’ Plugin for Hosting Media and Uploads

Problem: Uploaded media and uploads to the WordPress Media Library are unorganized, difficult to find to re-use or edit & overload website storage

Blogs need images and videos.

• Images and other media files uploaded into the native WordPress Media Library are stored in the website’s wp-content/uploads folder.
• WordPress by default, automatically adds three versions of an individual image file.
• Website themes and some plug-ins may also generate additional versions of an image file for use as featured images and thumbnails.
• All of these uploaded files add to the website’s storage size.
• The native WordPress Media Library ONLY allows organization of uploaded content by date – with no sorting or filtering available by file name or by blog post, let alone any kind of a directory structure.

In the screenshot below, the image_thumb.jpg had been uploaded to our blog’s native WordPress Media Library – and our WordPress installation and theme created 7 additional versions of the same file.

It didn’t take long until this website’s database was bloated by images – which also affects page loading times as well as increasing database and backup sizes. Many of our blog posts are heavy with images, with anywhere from 5 to 60 images per post. The website backups grew from 40 Mg to over 250 Mg after only 20 blog posts – with no other functionality added via the theme, customizations and plugins that would have added to that increased size. So all that ‘bloat’ was from WordPress Media Library contents! If the website ever needed to be moved to a different location, all those extra upload files will likely complicate and extend the process.

Solution: Move website images to Azure Storage!

There are numerous WordPress Plugins and WordPress code tweaks available online to help with fixing the image bloat in the WordPress Media Library – but why bother when there is the simple, convenient, secure and inexpensive means of storing and delivering WordPress images and other media in the cloud using Microsoft’s Azure Blob Storage!

In this and 2 subsequent posts, we’ll look at two ways to deliver stored image, video and other file formats from Azure Blob Storage to a WordPress website:

1. Direct Access to Blob Storage content using a hyperlink to the stored file/blob.

2. Using the “Windows Azure Storage for WordPress” plugin that delivers and uploads files from Azure Storage via WordPress Media

The points below are common to using either option 1 or 2 over storing media uploads in the website:

• Website content such as images & video are delivered by secure read-only https hyperlinks
• Images and videos will not be uploaded into the website’s wp-content/upload folder
• The website is streamlined without embedded images, using only hyperlinks, allowing for easy moving of a website, faster page load times, etc.
• Database and Backups are smaller – so website Restores should be faster
• Azure Blob Storage is a cost-effective, secure, reliable, scalable storage provider
• Both options 1 and 2 require and use access to ‘public, read-only’ Azure Blog Storage container(s)
• Azure storage Account credentials are only exposed to website Administrators
• Images must first be uploaded to the Blob Storage container before adding to website

1. Direct Access to Blob Storage via a hyperlink

Pros:

• No need to add another plugin to the WordPress website to gain this functionality
• Azure Storage Account Credentials are not exposed on the website’s admin pages – even to Administrators
• Easily provide SAS access to Blob Storage container for other website content contributors via MASE
• Using MASE, create a virtual directory organization structure by post/page title, category, topic, etc. for images and videos
• Use MASE’s convenient ‘CopyURL’ feature to capture the hyperlink for a stored image for pasting into post or page.
• Pasting the hyperlink into the Visual Editor view of a page or post, will instantly display the image, without having to select ‘Add Media’ or ‘Insert Image’ etc.
• Setup a custom domain on Azure Storage for the delivery hyperlink using HTTP
• Fast and efficient image delivery via secure SSL using Azure’s Blob Storage domain ‘<storage account name>.blob.core.windows.net/
• This is the solution we use on our websites – no plugin required.

Cons:

• It might still be necessary to upload some images to the website’s wp-content/upload directory for specific plugins that won’t process a hyperlink to deliver an image or other file type. For example, we use a plugin to create a Custom Login page for private websites, that only accepts logo images from the native WordPress Media Library. We have the same requirement for a website Feature Image by the theme we use.
• Files are visible by file name only on MASE – no thumbnails images to preview (although I still look at the thumbnails of the images in a folder on my local client via Windows File Explorer)
• Azure Blob Storage does not yet provide the ability to use SSL with a custom domain

2. ‘Windows Azure Storage for WordPress’ plugin

Pros:

• Plugin installs and configures easily after the ‘public, read-only’ Blob container is setup on Azure
• Gives the option to use WordPress’ upload to send images to Azure Storage
• Gives the option to keep local files after uploading them to Azure Storage via WordPress’ upload
• Provides a ‘Quick Access’ button on WordPress editing page to ‘Add Media from Azure’
• View thumbnails of Azure Storage files in WordPress Media screen
• Delivers hyperlinked media files from within WordPress Media Library function (offsetting the first ‘Con’ with Direct Access via Blob Storage above)
• Allows using a custom domain using SSL if a Content Delivery Network (CDN) is configured to Azure Storage, instead of using long Azure domain.

Cons:

• Azure Credentials for Azure Storage are exposed to website Administrators on the plugin’s setting page
• Uploads to Azure Storage via the WordPress uploader only creates the limiting ‘By Date Only’ organization structure on Azure Storage
• Uploads to Azure Storage via the WordPress uploader automatically create multiple versions of the same image – more if the theme or another plugin does the same!
• I find the back-end opening of the ‘Browse Azure Storage’ feature VERY slow compared to pasting in a hyperlink that instantly resolves
• One more plugin to maintain updates for and use up platform resources.

NOTE: It is also possible to setup an Azure Content Delivery Network (CDN) for even faster geolocation access of media files for the WordPress site, but we are keeping it simple and less expensive for the time being. A CDN can always be added as the next layer of delivery, if required. Configuring an Azure CDN will be covered in a future excerpt.

Part 2: Setup Azure Blob Storage to work with WordPress:
Part 3: Using ‘Windows Azure Storage for WordPress’ Plugin for Hosting Media and Uploads

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