Documentation

StackPath Setup for Amazon S3

This article assumes that you’ve already set up an Amazon S3 bucket and followed the steps within our Amazon S3 Quick Start Guide. You will also need an account with StackPath.

StackPath Setup

Once the above steps are taken care of, you will need to determine your S3 bucket URL. To do this, prepend your bucket name to “.s3.”, then your S3 region and finally append “.amazonaws.com”. In our example we created a bucket named “cdn-sandwichcity-com” on the S3 region “us-west-1”, so the S3 Bucket URL would be:

cdn-sandwichcity-com.s3.us-west-1.amazonaws.com

Next, login into your StackPath control panel and create a new site. Enter the custom subdomain you’d like to use for delivering the offloaded media into the Domain Name field, for this setup guide, we will be using “cdn.sandwichcity.com”.

Select “CDN” as the Available Services and click the Continue button.

StackPath setup - Create site

Enter the S3 bucket URL on the Hostname/IP Address, set the Origin Authentication to “None” and hit Continue.

StackPath setup - Site origin

On success, you will be redirected to the new site overview page. Please take note of the Site’s Edge Address URL on the top right corner as you will need it later on.

StackPath setup - Site settings

With StackPath configured, let’s move onto domain configuration.

Add your Custom Domain (CNAME)

Go to your DNS provider’s control panel (e.g., Hover, GoDaddy) and create a new CNAME entry for the chosen subdomain. This record must be pointed to the StackPath Site’s Edge Address we’ve mentioned before.

StackPath setup - DNS provider control panel

Create an SSL certificate

After allowing ample time for the DNS changes to propagate, you should also complete the validation process for a free SSL certificate. Navigate to the StackPath site sidebar and look for EdgeSSL, then click on Create Certificate located in the panel Custom Delivery Certificate.

StackPath setup - EdgeSSL create certificate

Next, click the Generate button in the Free Dedicated by Sectigo dialog. You can also upload your own certificate if you have one already by clicking Upload instead.

StackPath setup - EdgeSSL generate free certificate

In the new screen presented, select your custom domain in the Delivery Domains section and click on Continue to Validation.

StackPath setup - EdgeSSL delivery domain

Select HTTP Request as your validation method and finally click on Create Certificate. Bear in mind that this process should only be started if you have created the CNAME record for your custom domain.

StackPath setup - EdgeSSL response headers

StackPath will work with both HTTP and HTTPS requests as it makes the requests to the Origin with the protocol specified by the end-user. But if you want to modify that, you can by going to your site settings page and change it under the Pull Protocol option.

Configure WP Offload Media

Once your certificate is validated, log in to your WordPress dashboard and go to the Offload Media settings page. Scroll down to the Provider option under the Delivery section and click on Change. On the new page, select Another CDN and then StackPath as your new delivery provider and save the changes.

StackPath setup - Offload Media delivery provider

Back on the Offload Media settings page, go to the Custom Domain (CNAME) option, turn it on, and enter the domain name.

StackPath setup - Offload Media custom domain

Save the changes and clear your page cache if you have one enabled.

Testing Everything Works

At this point, it would be a good idea to check that all is in order and that StackPath is serving the Media Library items properly. Hop on over to the site’s Media Library and upload a new image. Then go to that image on the front-end of your website and open the Developer Tools (CMD+ALT+I macOS / CTRL+SHIFT+I elsewhere). You should see that the image URL is now pointed to your custom domain. You could also navigate to the Network tab and check the response headers, which should now contain a “X-HW” header.

StackPath setup - Response header

If those values match, your content is now successfully being served from StackPath. If not, please go back and check through the previous steps.