Integration Guide for WordPress Amazon S3 and CDN

Updated on July 19, 2018
56
Shares

In this tutorial, we are 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.

Amazon S3 is a storage solution, and part of Amazon Web Services many products. Typically this is used for large sites that either need additional backups or are serving up large files (downloads, software, videos, games, audio files, PDFs, etc.). Amazon has a proven track record of being very reliable, and because of their massive infrastructure, they are able to offer very low storage costs. Some of S3’s customers include Netflix, Airbnb, SmugMug, Nasdaq, etc.

WordPress Amazon S3

Due to the fact that Amazon S3 deals entirely with bulk storage, you can almost guarantee that pricing will be cheaper than your WordPress host. Offloading media to AWS can be a great way to save money and is free for your first year (up to 5 GB storage). Also, because the requests for your media is served directly from Amazon, this puts less load on your WordPress site, meaning faster load times.

Amazon S3 is not to be confused with Amazon CloudFront. CloudFront is a CDN solution, whereas S3 is a storage solution. However, they can both be used interchangeably as we’ll get into more below.

WordPress Amazon S3 Setup

For this integration, we recommend using the WP Offload S3 Lite plugin, developed by the awesome team over at Delicious Brains. 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.

WP Offload S3 Lite

WP Offload S3 Lite

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.

Step 1

Next, install the free WP Offload S3 Lite plugin. You can download it from the WordPress repository or by searching for “wp offload s3” within your WordPress dashboard under “Add New” plugins. Click on “Install Now” and activate it.

Install WP Offload S3 Lite

Install WP Offload S3 Lite

Step 2

You can follow the WordPress Amazon S3 documentation from Delicious Brains or we will walk you through the rest in more depth.  Log in to your Amazon Web Services account. If you don’t have one you can sign up for free. You will then need to create a new user. Choose a username and make sure you select “Programmatic access.”

amazon web services add user

Amazon Web Services – Add User

Step 3

Now you need to setup permissions for the user to manage files in S3, so select “Attach existing policies directly” and click on “Create policy.” This will open in a new window. Once you are done you will need to come back to this.

permissions aws

Permissions in AWS

Step 4

Click “Select” next to the create your own policy option.

create policy aws

Create policy in AWS

Step 5

Next you will need to give your policy a name and description. This can be whatever you want. Then copy the following code into the “Policy Document” section.

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

This policy allows the user to create buckets, delete files only (not buckets), upload files, download files, and list files and buckets. This is the basic level of permissions the plugins require to function.

However, we recommend checking out Delicious Brain’s documentation on additional bucket restrictions. For example, modifying the resource section above and adding your bucket name to lock it down (perftesting is the name of our buck down in Step 11).

"Resource": [
 "arn:aws:s3:::perftesting/*",
]

Then click on “Create Policy.”

review policy aws

Review policy in AWS

Step 6

Returning to the window from Step 4, you now need to add the policy to the user you are creating. Click on “Refresh” and you should see your new policy you just created at the top. Select that and click on “Next.”

aws permissions user

AWS permissions for user

Step 7

Then click on “Create user.”

aws create user

AWS create user

Step 8

On the last screen you will need to copy down your access key ID and secret access key to a safe place as you will need this for back in your WordPress dashboard.

aws access key

AWS access key

Step 9

Then back in WordPress click into “Access Keys” under AWS and input your credentials that you just created. Or, as Delicious Brains recommends, it is better to define them in your wp-config.php file. Simply copy the following snippet and replace the stars with the keys.

define( 'DBI_AWS_ACCESS_KEY_ID', '********************' );
define( 'DBI_AWS_SECRET_ACCESS_KEY', '****************************************' );
hookup amazon web services wordpress

Hookup Amazon Web Services in WordPress

Step 10

You must then create a bucket to use. If you are not signed up yet with Amazon S3, you can signup here. They have a free trial you can get started with. Click into “S3 and CloudFront” under the AWS plugin settings and click “Create bucket.” You can then choose a region. Click on “Create New Bucket.” Remember that storage costs vary per region. See prices.

create amazon s3 bucket

Create Amazon S3 Bucket

Step 11

To get WP Offload S3 to work with certain 3rd party plugins such as WooCommerce, you might need to install and activate some of their compatibility addons. And this sometimes requires paying for their premium license. However, there are a lot of times you can get by with the free version as well. By default, the following options as seen below are checked. if you are running over HTTPS you will want to enable that.

aws plugin settings

AWS plugin settings

Your WordPress Amazon S3 setup is now complete! Your images will now be copied to Amazon S3 storage when they are uploaded to your WordPress media library. You can also do the same technique with your assets (CSS, JS, fonts, etc), but it requires the premium license to get the assets addon.

Another important setting above is the option to remove the files from the local server once they have been offloaded to S3. This can help drastically reduce the disk space need with your WordPress host. Just make sure to check compatibility with other plugins if you enable this. You can also check out this tutorial on uploading files to Amazon S3 from the browser.

WordPress Amazon S3 and a CDN

If you are using a CDN to speed up delivery of your assets, you can enable this under the CloudFront or Custom Domain section. Check out these following tutorials to get you up and going.

Once you have it setup and your CDN URL, you can input it into the custom domain field as seen below.

cdn amazon s3

CDN Amazon S3

Make sure to also check out our guide on how to offload media to Google Cloud Storage.

Was this article helpful?
No, or there was something off

Hand-picked related articles

Use WordPress?

Use WordPress?

Join 20,000+ others who get our FREE weekly newsletter with WordPress tips on how to drive more traffic and revenue to your business!

Consent

You have Successfully Subscribed!

Send this to a friend