A Step-by-Step Guide with screenshots and explanations.

This article aims to provide you with how to use Cloudflare with WordPress using the free services that Cloudflare offers and demonstrate how you can use them to manage your WordPress websites.

In today’s digital landscape, having a fast and secure website is crucial for any business. Slow loading times and security vulnerabilities can lead to a loss of customers and revenue. One tool that can help address these issues is Cloudflare.

Using the free Cloudflare service with WordPress can optimize your site’s performance and security while improving reliability. This tutorial will explore how to use Cloudflare with WordPress and the benefits it can bring to your website.

From improved website speeds to enhanced security features, you won’t want to miss out on this powerful tool. So, grab a cup of coffee, and let’s dive into the world of Cloudflare and WordPress.

A quick overview of Cloudflare

Cloudflare is a web performance and security company that helps make the internet work as it should. It provides content delivery network (CDN) services, cloud cybersecurity, DDoS mitigation, and ICANN-accredited domain name registration services. Cloudflare has over 20 million customers worldwide and serves over 25 million internet properties in over 200 countries. Its global network spans over 200 cities in 90 countries and handles over 10 trillion monthly requests.

Cloudflare also offers a range of products to help businesses improve their website performance, including its CDN, DNS, DDoS protection, and security solutions.

How Cloudflare works?

Cloudflare acts like a bouncer at a party, standing between your web host and the incoming traffic to your website at the DNS level. With the ability to check each person as they enter, Cloudflare’s protection ensures that your website stays reliable and secure.

When a user attempts to access your website, the request goes to Cloudflare’s servers first. If it is from a trusted source, the request is forwarded to your web host, and your visitor can access the requested page. Otherwise, if the source is suspicious or malicious, Cloudflare will block the request

What are the benefits of Cloudflare with WordPress

• CDN
• Caching
• Security
• User Experience

Improve Website Performance (CDN)

The primary benefit of using a CDN like Cloudflare is improved website performance. CDN can significantly reduce website load times and improve website speed by caching website content on servers closer to users.

Cloudflare is especially important for websites with visitors from all over the world or experiencing high traffic volumes.

Reduce Bandwidth and Server Load (Caching)

Another benefit of the Cloudflare free CDN is that it can reduce bandwidth usage and server load. Caching website content on the Cloudflare network reduces the traffic that needs to be served directly from a website’s server.

It can help prevent server overload during periods of high traffic and reduce the risk of downtime or slow performance.

Improve User Experience

Cloudflare’s CDN also offers a range of advanced features that can further improve website performance and user experience.

For example, it can automatically compress images and other content to reduce file size and improve load times. It also supports HTTP/2 and HTTP/3, the latest protocols for web communication, which can further accelerate content delivery.

Why Integrating WordPress with Cloudflare is Beneficial?

WordPress is one of the most popular content management systems (CMS) in the world, powering over 43% of all websites on the internet. Because WordPress is open-source and widely used, it can be a popular target for cyber attacks.

Integrating Cloudflare with WordPress can help protect against these threats by adding an extra layer of security and performance optimization. Additionally, Cloudflare has a WordPress plugin that makes setting up and configuring its services for WordPress websites easy.

How to Use Cloudflare with WordPress?

Configuring Cloudflare for WordPress may appear to be a complicated process, but no need to fret! You’ll find it’s not too difficult by carefully following the steps. I’m here to help walk you through the process with a step-by-step guide

Step 1: Sign Up for a Cloudflare Account

The first step in setting up Cloudflare with WordPress is to create a Cloudflare account. You can do this by visiting the Cloudflare website and clicking the “Sign Up” button. Follow the prompts to create your account and log in to your Cloudflare dashboard.

Step 2: Add Your Domain Name to Cloudflare

Once you’ve created your Cloudflare account, you must add your website to Cloudflare. To do this, click the “Add Site” button in your Cloudflare dashboard and enter your website’s URL.

Cloudflare scans your site’s current DNS records to try to import as many as possible.

Step 3: Select a Cloudflare Plan

After adding your domain name, select a plan that suits your needs.

Cloudflare offers four plans:

• Free
• Pro
• Basic
• Enterprise

A free plan includes basic features like DDoS protection and a shared SSL certificate. You may upgrade to a Pro, or Business plan or need a Cloudflare Enterprise plan if you are a large business.

The free plan is all you need for your WordPress website. It is absolutely enough for most needs. Included in the free plans are 5 Firewall rules.

Step 4: Verify Your DNS Records

After selecting your plan, Cloudflare will show you a list of DNS records it found. You need to verify them to ensure that they are correct. Check if all the necessary DNS records are present and accurately entered. These records typically include A, AAAA, CNAME, and MX records.

If any of the DNS records are missing, you can add them by clicking on the “Add Record” button. Choose the type of record you want to add, enter the relevant details, and save the changes.

If there are any unnecessary DNS records, you can delete them by clicking on the “Delete” button. It reduces clutter and ensures that only the essential DNS records are present.

In my experience, it gets most of your A records, CNAMEs, and MX records. However, it frequently misses TXT records (like SPF, and DKIM, and other records used to validate services). These will need to be added manually.

Take your time and compare all DNS settings very carefully with your existing web hosting company

Step 5: Update Your Nameservers to Point Toward Cloudflare

Now you must update your nameservers to Cloudflare nameservers to use its services.

Follow the instructions below to update your nameservers to point your domain to Cloudflare:

• To update your nameservers, log in to your domain registrar. This is the company from which you purchased your domain name.
• Locate the DNS management section, where you can edit your domain’s nameservers.
• Replace the current nameservers with the Cloudflare nameservers provided during the Cloudflare setup process. Typically, there are two nameservers that you need to update.
• After updating the nameservers, save the changes.

To verify that the nameserver changes have taken effect, you can use an online DNS checker tool to check the DNS records of your domain. It will show you the updated nameservers.

After updating the nameservers, you need to wait for DNS propagation. This process can take up to 24 hours, during which the updated nameservers propagate to all the DNS servers worldwide.

Cloudflare is now set up, and you can begin exploring the features. In the following sections, I show you how to use Cloudflare with WordPress with the optimal settings.

Configure Cloudflare Settings

Once the nameservers are updated, you can configure the settings. This involves selecting which Cloudflare services you want to use, such SSL, caching, speed or firewall rules.

How to use Cloudflare SSL/TLS (Overview)

Cloudflare provides a free SSL certificate that provides secure communication between a user’s browser and a web server, which is essential for protecting sensitive information like passwords, credit card numbers, and other personal data.

With Cloudflare SSL, you can enable HTTPS (Hyper Text Transfer Protocol Secure) on your websites, which encrypts all communication between the website and its visitors.

Cloudflare offers four different SSL options:

Off

This option disables SSL encryption altogether, meaning all communication between the website and its visitors is unencrypted. It is not recommended, as it can leave sensitive data vulnerable to interception.

Flexible

This option encrypts the communication between the visitor’s browser and Cloudflare but not between Cloudflare and the website’s origin server. While it’s better than no encryption, it leaves the connection between Cloudflare and the origin server vulnerable to interception.

Full

This option encrypts the communication between the visitor’s browser and Cloudflare and between Cloudflare and the origin server. It is a more secure option.

Full (Strict)

This option is the same as Full and provides an additional layer of security by ensuring the certificate is not forged or otherwise invalid.

Keeping the SSL option to full is recommended because it can positively impact a website’s rankings, as search engines like Google prefer secure sites. Additionally, implementing SSL on a website can increase visitor trust and help protect sensitive data.

I recommend the Full setting.

Btw you may wonder why to use Cloudflare SSL when you already have an SSL from your web hosting provider.

Is it okay to use Cloudflare SSL when my host already provided an SSL certificate from Letsencrypt?

Absolutely! There’s no harm in using Cloudflare SSL (Secure Sockets Layer) in conjunction with an SSL certificate from Letsencrypt that your web host provided. In fact, using both can enhance the security of your website and provide additional layers of protection. Cloudflare SSL provides a secure connection between your website and its visitors, encrypting data transmission to prevent hackers from accessing sensitive information like passwords and credit card numbers.

Meanwhile, Letsencrypt SSL is the first free, automated, open certificate authority offering free SSL/TLS certificates. Both SSL certificates validate your website’s identity, which helps protect your visitors’ privacy and boost their trust in your site.

So, use both SSL certificates together and enjoy the benefit of extra security, making your website feel safer and more reliable for your audience.

SSL/TLS Recommender

Turn this on to be sure you’re using the best security

Edge Certificate

Here are my recommended settings.

• Total TLS: this should usually be turned on
• Always Use HTTPS: this should usually be turned on
•  HTTP Strict Transport Security (HSTS): you should use this to help prevent man-in-the-middle attacks.
  With HSTS enabled, the site must have an SSL certificate (through Cloudflare or your host), or it will not load.
  Toggle on all options and
  select 6 months(recommended) as MaxAge Header
• Minimum TLS Version: 1.0 Default
• Opportunistic Encryption: on
• Automatic HTTPS Rewrites: on
• CertificateTransparencyMonitoring: on

How to use Cloudflare Speed Optimization

Auto Minify

Auto Minify is a feature in Cloudflare that automatically compresses and optimizes a website’s code, reducing its file size and improving page load times. Specifically, Auto Minify removes unnecessary white space, comments, and other extraneous data from a website’s HTML, CSS, and JavaScript files, resulting in faster page load times and a better user experience.

To enable this option, go to Speed → Optimization → Auto Minify.

Cloudflare offers three types of Auto Minify: HTML, CSS, and JavaScript. You can choose which types of code they want to minify and enable the feature with just a few clicks.

I recommend enabling Auto Minify but keep it off if you are doing minification through a cache plugin. Additionally, in rare cases, Auto Minify may cause issues with certain website features or third-party scripts.

Brotli

Brotli is a compression algorithm that can significantly reduce the size of files, such as HTML, CSS, and JavaScript, without sacrificing quality. This results in faster load times and improved website performance.

In Cloudflare, the Brotli feature is available to all users and can be enabled through the “Speed” tab. Once enabled, Cloudflare will automatically compress eligible files using the Brotli algorithm.

Rocket Loader

Rocket Loader is a tool in Cloudflare that optimizes the loading of JavaScript files on websites. It works by asynchronously loading JavaScript files in the background while the rest of the page is being loaded, reducing the impact of JavaScript on website performance.

To enable Rocket Loader in Cloudflare, navigate to the “Speed” tab. Click the “Rocket Loader” option under the “Optimization” section. But most of the time, it is recommended to keep it off.

My recommendation

• Auto Minify: JavaScript and CSS turned on. I find HTML Minify might break analytic tracking code.
• Brotli: on
• Early Hints: on
• Rocket Loader: off
• Mobile: all settings off unless you have a standalone mobile site for some reason

Image Resizing (not needed)

The Image Resizing feature in Cloudflare is a tool that allows you to resize and optimize images on the fly. It can improve website performance and reduce page load times by reducing the size of images, which can be a major contributor to page bloat and slow loading times.

To enable image resizing, go to Speed, and click on the “Image Resizing” option under the “Optimization” section.

However, you must upgrade to the pro plan to access this feature.

Polish (not needed)

The Polish feature in Cloudflare is a powerful tool that allows you to optimize and compress images, improving website performance and reducing page load times. This feature is particularly useful for websites that rely heavily on images, such as e-commerce sites, photography portfolios, and online magazines.

The Polish offer multiple options, such as lossless compression, lossy compression, and WebP image format conversion. You must upgrade to the Pro plan or above to benefit from this feature.

How to use Cloudflare Web Firewall

Web Application Firewall (WAF) is a security feature offered by Cloudflare that helps protect websites from common online threats such as SQL injection attacks, cross-site scripting, and DDoS attacks.

Cloudflare’s WAF works by filtering incoming traffic to your website and blocking any malicious requests. It also allows you to create custom firewall rules to protect your WordPress site further.

The Cloudflare free version offers five rules that you can use to perform various actions, such as redirecting visitors based on the IP address to a specific page, caching certain pages for a longer duration, or adding security features to particular pages.

If you create a firewall rule, it needs careful testing. Otherwise, users from another country might be unable to access your website.

How to use Cloudflare caching

Caching can significantly improve the performance of your website. When you enable caching in Cloudflare, Cloudflare will store a copy of your website’s static content (such as images, CSS files, and JavaScript files) on its servers worldwide.

When a visitor requests your website, Cloudflare will serve the cached version of your website’s content from the server closest to the visitor, which can greatly reduce the time required to load your website.

Caching Level

It is recommended to set Cloudflare’s caching level to “Standard.” It caches all static content, including images, stylesheets, and scripts.

Browser Cache

Configuring the browser cache TTL (Time to Live) to one month or higher. This setting controls how long the browser should store cached content. By setting it to one month or more, returning visitors can access the website’s cached content without re-downloading, resulting in faster page load times.

Crawler Hints

Crawler Hints is another setting that helps optimize caching in Cloudflare. When turned ON, Crawler Hints enable search engines to better understand the website’s structure and content. It allows them to index the website more efficiently, improving search engine rankings and faster load times.

Always Online

Always Online is an optional setting that you may turn ON to ensure visitors can access the website’s cached content, even if the origin server is down. This feature is useful during server downtime or maintenance, ensuring users can access the website’s cached content.

Tiered Cache

Turning on Argo in the Tiered Cache settings can further optimize Cloudflare caching. Argo is Cloudflare’s optional content delivery optimization service that uses advanced routing techniques and prioritization algorithms to deliver content faster to users.

How to use Cloudflare networks

Cloudflare also offers various network settings that can be configured to optimize your website’s performance and security. You don’t need to pay much attention to these settings because the default settings work best. Some of the network settings offered by Cloudflare are:

How to use Cloudflare Scrape Shield

Scrape Shield is a security feature in Cloudflare that protects websites against malicious activities, including email harvesting and hotlinking. It provides website owners with tools to protect their content, prevent spam, and improve their website’s performance.

While these tools are helpful, they add JavaScript to the page load, affecting website performance. Therefore, it’s important to consider the impact on page load times before enabling these features.

If the website does not require protection against email harvesting or hotlinking, it’s recommended to keep these tools turned off.

Please see the screenshot for the recommended settings. Basically all settings should be turned off

How to use Cloudflare email routing

Cloudflare email routing allows you to create any custom email addresses and route them to the mailbox you choose. With Cloudflare’s free account, you can easily create and manage email addresses without monitoring additional services or software. Additionally, you can configure rules and catch-all addresses for your emails and leverage the power of Cloudflare Workers to implement any logic you need to process your emails and create automated responses. With Cloudflare Email Routing, you can easily create a free business email address for yourself or your business.

How to use Cloudflare with WordPress Plugins

There are several plugins you can install in WordPress for the Cloudflare network. I want to mention three plugins

• official Cloudflare (free)
• Super Page Cacher (free)
• WP Rocket (Paid)