How to Host Your WordPress Media Files on AWS S3

WordPress media items, such as images, videos and audio files, tend to take up a lot of space on your server’s storage drive. This can lead to a decline in your site’s speed over time, especially if you’re someone who publishes a lot of content with high-quality images.

In this tutorial, I’m going to walk you through how to complete a WordPress Amazon S3 integration as well as optionally using a content delivery network (CDN) alongside it. This can dramatically save you on bandwidth costs, act as a backup, and help speed up your site.

What is Amazon S3?

Amazon S3 is an object storage service from Amazon Web Services. You might not realize it, but a huge chunk of the Internet relies on Amazon S3, which is why even a brief S3 outage in one location can cause the whole Internet to collectively…well, freak out.

I’m not super interested in getting into the specific details of what object storage is (Wikipedia can help you out there). Instead, I’m more interested in how Amazon S3 and object storage connect to your WordPress site.

The most common use of Amazon S3 is to store all of the files that you would usually store in your WordPress Media Library in the cloud. Essentially, you can store (“offload”) your:

• Images
• Videos
• Audio files
• PDF Documents & etc…

Beyond that, some people also use S3 to store assets like CSS, JavaScript, etc.

Each Amazon S3 storage area is called a “bucket”. A bucket is basically a collection of files (you can read up about object storage if you want to know how those files are actually stored).

So essentially, rather than storing files on your own server, you’ll store them in a bucket at Amazon S3.

The WordPress S3 plugin that I will use for this tutorial

For this tutorial, I’m going to use WP Offload Media Lite from Delicious Brains because it’s the most well-known option at the time that I’m writing this article. The basic version is free. The plugin copies files from your WordPress site to Amazon S3 automatically as they are uploaded to the media library. There is then an optional configuration for adding a CDN, such as Amazon CloudFront, KeyCDN, or MaxCDN.

This plugin is pretty lightweight, only 204 KB to be exact. As of writing this, it currently has over 30,000 active installs with a 4 out of 5-star rating. Follow the steps below.

Why upgrade WP Offload Media?

So you’re already using the Lite version and wondering why you should upgrade? There is no support for free version. With a license, you can email them for help any time. An upgrade will also get you some important features. See the premium features below:

• PriorityExpert™ email support
• Upload existing Media Library to cloud storage
• Control cloud storage files from the Media Library
• Remove files from server
• Download and remove from Cloud Storage
• Copy between buckets
• Assets Pull Addon
• WooCommerce Integration
• WPML Integration
• Easy Digital Downloads Integration
• Meta Slider Integration
• Enable Media Replace Integration
• Advanced Custom Fields Integration

Let’s get started

Let’s follow the steps below in the video I’ve created for your better understanding.

Bucket policy

This policy is applied on the S3 bucket to enable public access

{
 "Version": "2008-10-17",
 "Statement": [
 {
  "Sid": "AllowPublicRead",
  "Effect": "Allow",
  "Principal": {
   "AWS": "*"
  },
  "Action": "s3:GetObject",
  "Resource": "arn:aws:s3:::YOURBUCKETNAME/*"
 }
 ]
}

Make sure to replace YOURBUCKETNAME with the actual name of your bucket

IAM policy

This policy below enabled the User access to the S3 bucket

{
 "Version": "2012-10-17",
 "Statement": [
 {
  "Effect": "Allow",
  "Action": [
   "s3:CreateBucket",
   "s3:DeleteObject",
   "s3:Put*",
   "s3:Get*",
   "s3:List*"
  ],
  "Resource": [
   "arn:aws:s3:::YOURBUCKETNAME",
   "arn:aws:s3:::YOURBUCKETNAME/*"
  ]
 }
 ]
}

Make sure to replace the two instances of YOURBUCKETNAME with the actual name of your Amazon S3 bucket.

Access keys to wp-config.php file

This following piece of code is what you put in the wp-config.php file

define( 'AS3CF_AWS_ACCESS_KEY_ID', '********************' );
define( 'AS3CF_AWS_SECRET_ACCESS_KEY', '**************************************' );

Remember to replace the asterisks with the keys you will generate as part of the User setup in the AWS Console (IAM Service).

Have any other questions about connecting your WordPress site to Amazon S3?

Leave a comment and I’ll do our best to help out! Also don’t forget to subscribe to my YouTube channel as I’m sharing more tips and tricks as well as videos related to web design.