Cloudflare CDN for MyListing Websites
Get the knowledge your online business needs to succeed.
The Cloudflare CDN for MyListing Websites guide will show you how to easily configure the solution according to best practice.
We use Cloudflare for almost every site we implement, in order to take advantage of the additional performance, security, reliability, and analytics it provides.
Cloudflare Initial Setup
- Sign up for a Cloudflare account.
- Enter your domain name in the Site field and click Add site.
- Click Next, choose the free plan, click Confirm plan, and click Confirm.
- After the scan completes, click Continue.
- Open a new browser tab and log into your current DNS hosting account.
- Edit your DNS settings for the same domain you’re currently adding to Cloudflare.
- Compare the discovered DNS records on the Cloudflare side, to the DNS records on the DNS Hosting account side.
- Add any missing DNS records on the Cloudflare side or just click Continue.
- On the current DNS Hosting account side, change the Nameservers to match what Cloudflare provides, and click Continue. (Note: Although it rarely does, it may take up to 24 hours for the DNS to propagate across the web. Once DNS has fully-propagated, Cloudflare will show Status: Active. Proceed on once the propagation has completed.).
- Cloudflare > Overview > Advanced Actions > Pause Cloudflare on Site (Note: With the website still in development, we want to keep the optimization portion of Cloudflare turned OFF.).
- Cloudflare > DNS > Change the A records so that they point to your website’s server IP address.
- Cloudflare > SSL/TLS > Change the encryption level to Full (Note: When you go to implement a non-custom SSL certificate like the free Let’s Encrypt certificate, Full is the appropriate Crypto choice, compared to say Full Strict. This is because Full Strict has an additional handshake that’s not required.).
We currently use the settings below, but we’re constantly testing for the best optimization, so please check back in every now and then to get the latest setting recommendations.
If a setting is not specifically mentioned, assume we are just using the defaults.
- Edge Certificates > Always use HTTPS: On
- Edge Certificates > HTTP Strict Transport Security (HSTS): Enabled/Configured
- Status: On
- Max-Age: 6 months (Recommended)
- Include subdomains: On
- Preload: On
- Edge Certificates > Automatic HTTPS Rewrites: On (Note: You may already have this enabled in your .htaccess file. We found a slightly better performance increase when using Cloudflare to rewrite HTTPS. In the end, just make sure not to duplicate rewriting.)
- Speed > Optimization > Auto Minify: Disabled. (Note: We use WP Rocket for minification since it’s better to do this at the plugin level before the CDN grabs the assets.).
Cloudflare’s Free tier allows for up to 3 page rules, which can be used to further secure and/or optimize your website.
Please note that a common mistake website owners make is to create a Page Rule to cache what Cloudflare already caches by default. Here are the page rules we currently use for this tier.
Page Rule 1
We are telling Cloudflare to avoid caching for the /wp-admin/ area, as well as /wp-login.php and /wp-json.php. (Note: Folders like /wp-uploads/ will still be cached by Cloudflare…automatically.).
Page Rule 2
We are telling Cloudflare to avoid caching for all of the WooCommerce endpoints.
Page Rule 3
We are telling Cloudflare to cache everything, including the website’s static HTML.
Typically, the cache everything rule is not recommended for websites where people are required to log in, but we are counteracting this with Page Rule 2.
- Email Address Obfuscation: Enabled
- Server-side Excludes: Enabled
- Hotlink Protection: Enabled
Verify Cloudflare Caching
- Follow the GTmetrix section of our Optimize MyListing Websites for Outstanding Performance guide.
- When the results come back, click on the Waterfall tab.
- Expand the first item on the list which should be your domain name.
- Click on the Response tab.
If Cloudflare is caching a particular asset, you will see a result of CF-Cache-Status: HIT.
Note: For more information about the various Cloudflare caching codes (e.g. HIT, MISS, EXPIRED, etc.), view their support article on this topic.
Cloudflare Cache Maintenance
As website professionals push out new content (copy, design, etc.) it’s important to ensure customers and users are being served the correct (current) content.
If you’re someone who runs a really tight ship, there is a manual process for clearing Cloudflare’s cache.
The manual option is good for keeping plugins to a minimum, while also ensuring the cache is absolutely getting cleared.
To clear Cloudflare’s cache, you have the option to clear the cache for a specific URL or for your entire website.
We recommend clearing the cache for a specific URL, in order to keep your overall cache in untouched.
- Cloudflare > Caching > Custom Purge.
- Enter the URLs you which to purge, using the simple instructions that Cloudflare provides.
- Click Purge.
While the process to manually clear Cloudf’lare’s cache is simple, it is also easily forgotten, and that’s where the automated options come into play.
To automate the Cloudflare cache-clearing process, we recommend WP Rocket, due to its overall ability to performance-optimize a website.
If using a no-cost solution is desired, you can use Cloudflare’s proprietary plugin.
Cloudflare Cache Management with the WP Rocket plugin
- Install and activate WP Rocket.
- Settings > WP Rocket > Add-Ons > Toggle on the Cloudflare add-on.
- Click Modify Options.
- Log into your Cloudflare account.
- Using your Cloudflare account, fill in the Global API Key, Account Email, and Zone ID.
- Save changes.
Cloudflare's Proprietary Plugin
- Install and activate the Cloudflare plugin.
- Settings > Cloudflare > Click the Sign in link.
- Add your Cloudflare email and API Key.
- Click Save API Credentials.
- Automatic Cache Management > Toggle on.
- Click I’m Sure.
Grant Team Access
- Log into Cloudflare.
- Click Members from the top menu.
- Enter the email address of the person you would like to invite.
- Click Invite.
Let's empower others. Share the knowledge.