How to move WordPress media files to CloudFlare

Create a CloudFlare account

If you don’t have a CloudFlare account, create one and add a domain using this tutorial.

Create a subdomain

Using cPanel, create a subdomain for your CDN content.

You can call the subdomain anything you like but we recommend something similar to cdn for ease of recognition.

Create a CNAME record in CloudFlare’s DNS settings

Follow this guide to add a CNAME record in your CloudFlare dashboard, though instead of using “blog” use “cdn” or whatever subdomain you created in step 2, as below.

Review CloudFlare’s DNS settings

Check that the only record that has its traffic routed through CloudFlare’s servers is the one you created in step 3.

In the image below you can see that only the CNAME record cdn is passing through CloudFlare’s network, as indicated by the orange cloud.

If there are any other records that are passing through CloudFlare’s network, i.e. those that have an orange cloud, click on them and ensure they are grey and therefore no longer being passed through CloudFlare’s network.

Change the location for your WordPress media uploads

Using cPanel’s File Manager, open the file wp-config.php, which is typically in your public_html folder

Add the following below the opening php statement, replacing cdn with whatever you created in step 2

Create a redirect using htaccess

Presently your images will be served from yourdomain.com/cdn/uploads, in order to make sure this is instead cdn.yourdomain.com/uploads we need to create a htaccess redirect

This is a fairly simple process:

Open File Manager from within cPanel

navigate to your public_html directory

right click on the .htaccess file and click edit(If you can’t see this, click settings in the top right hand area of your screen, tick show hidden files and save).

Edit the file as follows, you may already have a block starting with “RewriteEngine On” in which case place the code below directly underneath that line and make sure you don’t have duplicate “RewriteEngine On” lines.

Replace cdn/ and cdn.yourdomain.com with whatever you created in step 2

Move existing uploads

Use cPanel’s file manager to move all content in /wp-content/uploads/ to the CDN folder you setup in step 2 when you created a subdomain. In my case this was /public_html/cdn

Change image URLs in the database

Use phpMyAdmin to change the existing WordPress media library folder to the new one

click the phpMyAdmin link on your cPanel dashboard

Click the relevant dashboard on the left hand side

Click the SQL button the top menu

Copy and paste the following code into the white box:
– replacing wpda to whatever your database prefix is (see the red boxes in the screenshot)
– replacing yourdomain.com/wp-content/uploads with the location of your WordPress uploads folder
– replacing cdn.yourdomain.com with the subdomain you created in step 2

UPDATE wpda_posts SET post_content = REPLACE(post_content,’yourdomain.com/wp-content/uploads’,’cdn.yourdomain.com/uploads’)

Click the go button to replace these references in your database

Delete existing content

Now that we’ve copied across the media files to the new location and updated the image location in the database, we can use cPanel’s File Manager to delete the existing media content

Redirect Existing Indexed Images

Finally so that any images that have been indexed by search engines are redirected gracefully, ensure you add the following redirect to your htaccess file.

Replace cdn, yourdomain and .com to suit how you have configured the cdn subdomain in step 2