Wasabi Cloud Storage Quick Start Guide

While WP Offload Media does not officially support Wasabi Cloud Storage as a storage provider for offloading your WordPress Media Library to, that doesn’t mean you can’t use it!

We also have Quick Start Guides for other storage providers.

This guide has the following steps:

1. Create a Wasabi User with Programmatic Access
2. Set Up the WP Offload Media Tweaks Plugin to Work with Wasabi
3. Add Access Keys to WP Offload Media
4. Create Bucket
5. Offload Media Library to Wasabi
6. Set Up a CDN

Create a Wasabi User with Programmatic Access

Log in to the Wasabi Management Console, navigate to the Users area and click the Create User button.

Enter your preferred username into the Create User dialog, make sure the Programmatic (create API key) Access Type is selected, and click the Next button.

If you wish to use user groups in Wasabi you can select or create one, for the sake of brevity we’re going to skip this optional step and click the Next button.

You must however select a Policy to attach to the User. We strongly recommend selecting the “AmazonS3FullAccess” policy at first to ensure everything works as intended. You can update the user’s policy later to restrict access if you wish. Click the Next button once the “AmazonS3FullAccess” policy has been selected.

You should now be presented with a dialog that confirms the username, access type and policy the new user will have. If all looks as it should, click the Create User button.

You may see a couple of dialogs zip by, but eventually you’ll be presented with an opportunity to download, view, or copy the new user’s Access Keys. This is the only chance you’ll have to see the keys (although you can create new keys later), so make sure to download the CSV file for safe keeping, you’ll need these keys later.

Once you’ve secured a copy of the access keys and closed the dialog you should be able to see your new user in the Users area of the Wasabi Management Console.

Set Up the WP Offload Media Tweaks Plugin to Work with Wasabi

Wasabi Hot Cloud Storage is Amazon S3 API compatible, but for WP Offload Media to be able to connect to it, some tweaks need to be made to the URLs the plugin uses for managing storage. Luckily, we have a WP Offload Media Tweaks plugin that you can download, install into your WordPress site, and then edit to activate the Wasabi tweaks.

Download the zip file from GitHub, upload the zip file to your WordPress site via the Plugins admin dashboard area, and then activate it.

It is safe to activate the WP Offload Media Tweaks plugin as by default none of its tweaks are active, you have to edit the plugin’s amazon-s3-and-cloudfront-tweaks.php file to enable its functionality.

We’ve added a group of example add_filter calls for handling Wasabi to the __construct() function. To activate them, remove the // from in front of the five add_filter calls so that they look like the following.

/*
 * Custom S3 API Example: Wasabi
 * @see https://wasabi.com/
 */
add_filter( 'as3cf_aws_s3_client_args', array( $this, 'wasabi_s3_client_args' ) );
add_filter( 'as3cf_aws_get_regions', array( $this, 'wasabi_get_regions' ) );
add_filter( 'as3cf_aws_s3_bucket_in_path', '__return_true' );
add_filter( 'as3cf_aws_s3_domain', array( $this, 'wasabi_domain' ) );
add_filter( 'as3cf_aws_s3_console_url', array( $this, 'wasabi_s3_console_url' ) );

Further down in the amazon-s3-and-cloudfront-tweaks.php file are the four functions (yes four, one of the add_filter calls just uses the __return_true built in function) that the add_filter calls use.

function wasabi_s3_client_args( $args ) {
    $args['endpoint']               = 'https://s3.eu-central-1.wasabisys.com';
    $args['region']                 = 'eu-central-1';
    $args['use_path_style_endpoint'] = true;

    return $args;
}

function wasabi_get_regions( $regions ) {
    $regions = array(
        'us-east-1' => 'Wasabi US East 1 (N. Virginia)',
        'us-east-2' => 'Wasabi US East 2 (N. Virginia)',
        'us-west-1' => 'Wasabi US West 1 (Oregon)',
        'eu-central-1' => 'Wasabi EU Central 1 (Amsterdam)',
        //'ap-northeast-1' => 'Wasabi AP Northeast 1 (Tokyo)', // Restricted
    );

    return $regions;
}

function wasabi_domain( $domain ) {
    return 'wasabisys.com';
}

function wasabi_s3_console_url( $url ) {
    return 'https://console.wasabisys.com/#/file_manager/';
}

The above versions are stripped of header comment blocks to save space, please see the Tweaks plugin for full descriptions of the functions.

If you’re going to be using the “eu-central-1” Wasabi region for your bucket, then you’re done, save your changes to the __construct function and move onto the next step.

If however you’re going to be using a different region, please change the wasabi_s3_client_args function to replace eu-central-1 with your chosen region. If you’ve chosen the default “us-east-1” region for your bucket, then you can optionally change the endpoint entry to have the value “https://s3.wasabisys.com”, but Wasabi works fine with an “us-east-1” segment in the endpoint too. Either way, the “region” entry in the $args array must be the actual region, e.g. “us-east-1”.

Add Wasabi Access Keys to WP Offload Media

With the updated Tweaks plugin in place and activated, you can now set up WP Offload Media to use the Access Keys you saved earlier.

Navigate to WP Offload Media’s settings page and choose Amazon S3 as the storage provider. If this is the first time you’ve set up WP Offload Media then this should be the default.

Select Define access keys in wp-config.php and follow the instructions.

If you downloaded the CSV file with your new user’s credentials, the second and third columns in the file have nice and clear column headers of “Access Key Id” and “Secret Access Key” for you to use.

Once you have saved your changes to the site’s wp-config.php file, return to WP Offload Media’s settings page and refresh it if necessary to be automatically taken to the screen for choosing a bucket.

Create Bucket

In our example we’re going to create a bucket via WP Offload Media, so we’ve clicked the “Create new bucket” link, but you can also “Browse for bucket” or just enter an existing bucket name.

In the “Create new bucket” screen below we’ve picked the region we want to use and that matches with the code we edited in the Tweaks plugin, and entered our chosen bucket name.

Because we’re going to use Cloudflare as our CDN later in this guide we’ve chosen a bucket name that is the same as the Custom Domain (CNAME) we’re going to use. However, if you’re going to use a different CDN then your bucket name does not need to look like a domain name, it could for example be all one word or broken up with dashes, e.g. “spicy-hot-media”.

Once you’ve entered the details of the bucket, click the lower left button (Create New Bucket in our case) to proceed.

You should now be redirected back to WP Offload Media’s settings page.

You can safely ignore the “Block All Public Access Status Unknown” message displayed under the bucket’s region. This relates to the fact that we’re just using the Amazon S3 Storage Provider, with a few tweaks, and Wasabi does not have the Block All Public Access feature.

Offload Media Library to Wasabi

Now’s a good time to offload your media and test that all is well. Click the Offload Now button found in the “Your Media Library needs to be offloaded” box in the top right of WP Offload Media’s settings page.

WP Offload Media will now offload everything from the Media Library to your chosen Wasabi bucket, and content displayed to site visitors will start using Wasabi URLs instead of local media URLs.

This process happens in the background, you do not need to stay on WP Offload Media’s settings page while the offload happens.

Once complete, a message will be displayed in the WordPress admin dashboard and in WP Offload Media’s settings page.

You can now test that everything is as expected. First click the little “external link” icon next to the bucket name in WP Offload Media’s settings page to be directed to the Wasabi Management Console.

After logging in as necessary, you should find yourself in the bucket browser, at the root path of where WP Offload Media has been configured to offload media to.

You can now click down the folder hierarchy to see your offloaded media.

If you visit the WordPress admin dashboard’s Media Library and view the details of an offloaded item, you should see details of where it has been offloaded to, and the URL it now uses.

Set Up a CDN

Offloading your media is all well and good, but we highly recommend using a CDN to speed up delivery of your media to site visitors no matter where in the World they are, and also improve SEO by using a custom domain.

In this guide we’re going to use Cloudflare as our CDN.

If you’re not using Cloudflare already for hosting your domain, or simply want to use a different CDN provider, Wasabi has a number of articles on how to set up different CDN services to pull from a Wasabi Hot Storage bucket, including guides for Amazon CloudFront and StackPath. Please return to this guide after configuring your alternate CDN, and skip down to the Change Delivery Provider section.

Cloudflare DNS Settings

Log into the Cloudflare Dashboard and navigate to the DNS settings for your domain. Click the Add Record button.

Change the Type to “CNAME”, and enter the first segment of your chosen custom domain name as the Name, and full domain for the bucket as the Target.

The Target consists of four parts separated with dots:

1. The full domain for the bucket. In our example this is ian-cdn.brains.us
2. The word s3
3. The name of the region. In our example this is eu-central-1
4. The wasabi domain name, wasabisys.com

Combining all four parts together for our example we get:

ian-cdn.brains.us.s3.eu-central-1.wasabisys.com

However, if you are using the default “us-east-1” region for the bucket, then you may remove the region from the target domain. For example, if your site is hosted at “https://example.com”, your chosen domain is “cdn.example.com”, and that bucket was created in the “us-east-1” region, you would enter the following as the Target for the “cdn” CNAME entry:

cdn.example.com.s3.wasabisys.com

Ensure the Proxy status is left as “Proxied” (with an orange cloud icon), then click the Save button to create the new DNS record.

Change Delivery Provider

Give the new entry a couple of minutes to propagate around the World, then switch back to your site’s WP Offload Media settings page and click the “Change” link next to “Amazon S3” in the Delivery section.

From the list of Delivery Providers, select Another CDN, then Cloudflare, confirm your choice by clicking the Save Delivery Provider button.

If you are configuring a different CDN then please select their entry instead (if available), or the Other option under Another CDN. If using Other you are given the option to enter a name for the CDN service to be displayed in the settings for your reference.

Now that you’re back in WP Offload Media’s settings page, enable the Custom Domain (CNAME) setting and enter the appropriate domain name into the box that is revealed. Then click the Save Changes button to complete set up.

If you revisit an already offloaded Media Library item, you should see that its URL now uses the custom domain of the CDN.

Congrats, you’ve now set up your WordPress site to serve its media from a Wasabi Cloud Storage bucket and a CDN. 🎉️