Tipsnow.info

Get Help & Tips About Technology

CloudFlare Cache Speed Up WordPress HTML

This tutorial shows how to activate Cache Everything on CloudFlare for a WordPress website in order to fully speed up the website from HTML to images through CloudFlare CDN.

[xyz-ips snippet=”jahir”]
[xyz-ips snippet=”alo”]
[xyz-ips snippet=”jahir2″]

If you haven’t use CloudFlare, register for an account.
If the domain is not already added to CloudFlare and the domain is still not using CloudFlare as DNS server, do the following:
In CloudFlare, hit +Add Site to allow CloudFlare to Begin Scan and import DNS records and set up the website in CloudFlare.

When the scan is complete, click on Continue Setup.
Verify the DNS records for the domain (add missing one, edit incorrect one or remove unused one), and hit Continue button.
Select Free Website as the CloudFlare plan, and hit Continue.

Change the nameservers (NS servers) as defined on the domain registrar to the CloudFlare nameservers, and then click on Continue. Once CloudFlare verifies that the name servers are correctly configured, the domain will be added to CloudFlare and available for use.
In CloudFlare, under DNS tab, make sure that status is Orange in color for the domain and sub-domains that you want CloudFlare to cache. When mouse over, the status is DNS and HTTP proxy (CDN), indicating that HTTP proxy is enabled.

Go to Caching tab.
Under Browser Cache Expiration section, set the option to Respect Existing Headers.

Go to Page Rules tab.
Note
Free plan of CloudFlare allows only maximum of 3 page rules.

Create the following rules (rules 1 to 3 are optional), and click Hit and Deploy when done for each rules:
If the URL matches: domain.name/wp-admin* {replace domain.name with actual domain name}
Then the settings are:
Cache Level: Standard
Disable Performance

If the URL matches: domain.name/*preview=true* {replace domain.name with actual domain name}
Then the settings are:
Cache Level: Standard
Disable Performance

If the URL matches: domain.name/wp-login.php* {replace domain.name with actual domain name}
Then the settings are:
Cache Level: Standard
Disable Performance

If the URL matches: domain.name/* {replace domain.name with actual domain name}
Then the settings are:
Cache Level: Cache Everything

As CloudFlare has no link to WordPress, it’s important to let CloudFlare know and purge its cache when content on WordPress site changed. To do so, install, activate and configure the plugins that help to do so, such as aptly named CloudFlare, Sunny or built-in feature of caching plugin such as W3 Total Cache.
Voila, now CloudFlare acts as CDN for all and complete WordPress resources, including HTML. You can check and verify CloudFlare caching through HTTP header.

Updated: June 13, 2019 — 12:36 pm

The Author

Leave a Reply

Your email address will not be published. Required fields are marked *

Tipsnow.info & 2024