Media Cloud for WordPress
- Additional Resources
Media Cloud is a revolutionary plug-in for WordPress that will supercharge the performance of your website and radically transform the way that you work with media in WordPress.
Media Cloud works by moving your images, media and other files from your WordPress server to online cloud storage such as Amazon S3, Google Cloud Storage, DigitalOcean Spaces and many others. You can then serve that media through a CDN like Amazon Cloud front, Cloudflare, Fastly and others.
Beyond cloud storage, Media Cloud also has deep integration with imgix, the leading real-time image manipulation and optimization CDN. Media Cloud is the first plugin for WordPress to bring the full benefit of what imgix offers - simplifying your development efforts, reducing your site’s page load times and opening up creative options that simply haven’t existed until now.
Media Cloud also provides advanced image editing tools that provide improved cropping options, effects, filters, watermarking and more.
There are two ways to install this plugin: via the WordPress plugin dashboard, or manually via Composer.
- Installing via WordPress
- You can add this plugin directly from the WP admin plugin dashboard or head over to the plugin page here: https://wordpress.org/plugins/ilab-media-tools/
- Installing via Composer
composer require ilab/ilab-media-tools
Once installed, you will need to set up both your S3 and imgix credentials. Before you get started with either of those, go to Media Cloud → Enable/Disable Tools, and enable these options:
- Image Crop
- imgix Support
First, access access the storage settings in the sidebar:
Once there, select your S3 source and configure the settings to whatever your preference is.
We've included notes for more important options below:
Delete Uploaded Files: This deletes uploaded files from the WordPress folder after they've been successfully uploaded. If you wish to save on bandwidth, this is a useful feature to enable.
If you have this enabled, note that using the batch import feature in Media Cloud will cause WordPress images to be deleted from the folder after they've been uploaded.
To set up imgix, access the imgix settings on the left sidebar:
Simply enter your imgix domain (ex: subdomain.imgix.net) in the imgix Domains field and check off the options you need.
Below are some notes for the more important options:
- Use HTTPS: This is important to enable if your site is using HTTPS, otherwise your images may not render.
- Keep WordPress Thumbnails: Turning this feature off can save you space, as imgix generates several sizes for you using parameters. However, if you ever plan on turning off imgix, keeping this feature turned on can allow you to switch back to WordPress images easily.
- Enable GIFs: As this is a premium feature, you should contact the imgix sales team before enabling this option
The Storage Importer tool allows Media Cloud to import all your WordPress images into your S3 bucket.
Before doing this, we recommend turning off the Delete Uploaded Files feature in the storage settings, as uploading the images will cause images to be deleted with this setting turned on.
Once you've confirmed that the files have been uploaded correctly into the correct folders, you can delete the images manually from your WordPress folder.
Media Cloud only serves images through imgix for images post installation. For images that were previously being served via WordPress, they will continue to use WordPress image links.
If you wish to change all your WordPress image links to use imgix URLs, you can do this by editing the WordPress database. General instructions below:
NOTE: Before proceeding, please make a backup of your WordPress site and your database.
- Install the Media Cloud plugin and edit the configurations
- After connecting the Media Cloud plugin to your S3 bucket, upload a few images and make note of the folder structure in S3
- Upload the rest of your WordPress images to your S3 bucket, making sure to clone the folder structure in your S3
- Do a find and replace in your WP database (instructions vary on how to do this - you can try exporting the database → edit it with a code editor → import it back)
- Make sure to make a backup of your database before doing any find and replace operations. Failing to do so will prevent you from restoring your data in case you make a mistake.
- Look for old image BASE paths (ex:
- Replace with your new imgix path (
- Save and apply
- This should update all your old image URLs with your new imgix URLs. Any new URLs being used will use imgix as per your Media Cloud settings.
Note that these are the general instructions for converting WordPress image URLs to imgix. Depending on your WordPress setup, you may need to do more than just edit the database values.
Media Cloud allows for automatically applying the parameters auto=format,compress for all imgix images in your WordPress site.
If you need to set other parameters on a global level, you can do so by setting up default parameters in your Source.
As of WordPress 4.4, srcsets are automatically generated using the different sizes that are generated in WordPress.
It's recommended to edit the WordPress template files to ensure that the sizes attribute is set to display the images at the correct dimensions on your site.
- @imgix/contentfulbuildBrowse for, select, and insert image assets into your content quickly and easily via the imgix Image Manager.TypeScript 5 6 days ago
- Craft Image OptimizeAutomatically create & optimize responsive image transforms, using either native Craft transforms or a service like imgix, with zero template changes.PHP 232 a month ago
- Imager X for CraftAn image manipulation plugin for the Craft CMS that supports imgix URLsPHP 15 4 days ago
- Nuxt ImagePlug-and-play image optimization for Nuxt apps. Resize and transform your images in your code using your imgix images.TypeScript 512 3 days ago
- Statamic PluginAn add-on for integrating imgix into Statamic sitesPHP 17 9 months ago
- Superbig Craft PluginA plugin for the Craft CMS that adds full access to the imgix API for manipulating imagesPHP 12 3 months ago