Do you want to use the free Cloudflare CDN on your WordPress site?
Cloudflare is one of the best WordPress CDN services available in the market. They offer a free CDN that speeds up your website along with a suite of powerful security features for small business websites.
The challenge is that many entry-level users are not able to use Cloudflare because they think it is hard to set up.
In this guide, we will walk you through a complete Cloudflare setup in WordPress to help you improve your website speed.
What Is a CDN?
A CDN or content delivery network is a system of distributed servers that helps deliver your website files faster to users based on their location.
Typically, a web hosting service serves your website visitors from a single location. All the users access the same server, no matter where they are located.
This can cause a delay in content delivery for users living further away from your website’s central hosting server.
That’s why CDNs set up multiple edge servers in different locations around the globe.
These CDN servers cache static content from your website’s origin server and present it to users when they visit your WordPress website.
When there is a user request, the CDN server closest to the user’s location will handle it.
For example, if someone in the USA wants to access a UK-hosted website, then a CDN server in the USA will serve that request, not the main server in the UK.
With a CDN, all the user requests are handled by the nearest CDN servers. This reduces the physical distance between the visitors and your website’s server.
As a result, a CDN improves your website performance and speed for all users regardless of their geographic location.
A faster website also improves the user experience and can give your website a slight boost in SEO rankings. Using a CDN also reduces the load on your primary server and protects it from crashing during traffic spikes.
If you want to learn more, then see our guide on why you need a CDN for your WordPress blog.
What Is Cloudflare CDN?
Cloudflare is one of the most popular free CDN providers available on the internet. It is a large network of globally-distributed servers that automatically cache static content and deliver dynamic content quickly.
On top of a CDN service, Cloudflare is also a cloud-based website firewall and a distributed proxy server. It monitors all incoming traffic to your website and blocks suspicious traffic even before it reaches your server.
They offer a free basic plan that’s suitable for small business websites and blogs. They also offer paid plans starting at $20 per month.
Cloudflare is an excellent choice for small businesses looking for a free CDN. However, if you want to fully utilize all of Cloudflare’s features, then you will need the Business plan, which costs $200 per month.
Note: We do not use Cloudflare on WPBeginner. Instead, we use Sucuri as a website firewall and CDN. This firewall has the double benefit of improving speed and security. You can learn more in our comparison of Sucuri vs. Cloudflare.
With that being said, let’s take a look at how to set up Cloudflare Free CDN in WordPress. You can use the quick links below to jump to the different parts of the tutorial:
Setting Up Cloudflare CDN in WordPress
To begin, you need to visit the Cloudflare website and click on the ‘Sign Up’ button.
On the next page, you need to enter your email address and password to create a Cloudflare account.
Simply enter the information required, and then click on the ‘Sign up’ button.
When you finish signing up, you will see a thank you page confirming that your Cloudflare account has been set up.
The next step is to add your website to Cloudflare. You should click the ‘Add a website or application’ button to get started.
You can now enter your website into the ‘Enter your site’ field.
Make sure you only type your site’s domain name, such as example.com. You don’t need to type the full URL or any extra characters.
On the next screen, you will be asked to choose the type of Cloudflare plan you want.
For this tutorial, we will choose the free Cloudflare plan. Then, click the ‘Continue’ button.
After that, Cloudflare will show you a list of all DNS records their systems found. These will include your subdomains as well.
The DNS records you want to be passed through Cloudflare should have an orange cloud icon. The DNS records that will bypass Cloudflare will have a gray cloud icon.
You need to review the list to make sure that your primary domain is active on Cloudflare with an orange cloud icon. Simply click the ‘Proxy status’ toggle to change the status.
Once you have verified your DNS records, just click on the ‘Continue’ button at the bottom.
During the next step of your setup, Cloudflare will ask you to update your nameservers. You will be asked to change your nameservers and point them to Cloudflare nameservers.
Note: Changing nameservers can take some time to propagate throughout the internet. During this time, your website may become inaccessible to some users.
You can change nameservers from your domain registrar account, like Domain.com.
Or, if you got a free domain from your web hosting provider like Bluehost, then you will have to change the name server by logging in to your hosting account.
For the sake of this tutorial, we will be showing you how to change the nameservers from the Bluehost control panel.
While the process is similar across hosting companies, you can always ask your hosting provider for detailed instructions for their control panel.
Once you are logged in to your Bluehost cPanel dashboard, go to the ‘Domains’ section, and select your domain name. After that, click on the ‘Name Servers’ tab and the ‘Edit’ button.
Next, you need to select ‘Custom’ and enter the nameservers provided by Cloudflare.
Then, click the ‘Save’ button.
After that, you need to go back to the Cloudflare setup page, and click the ‘Done, check nameservers’ button to finish the setup.
It will now check your new nameservers automatically.
That’s it! It will take a few minutes to update your domain nameservers and activate Cloudflare.
Once activated, you will see the success message in your Cloudflare dashboard.
In the meantime, the Cloudflare Quick Start Guide will open automatically, and you can use it to customize your Cloudflare settings. We will show you how in the next section.
Note: The above screenshots show the Bluehost control panel. Your nameserver settings may look different if you are using a different hosting provider.
Configuring Cloudflare With the Quick Start Guide
The Cloudflare Quick Start Guide should have opened automatically after you clicked on the ‘Done, check nameservers’ button above. This setup wizard will help you improve the security and performance of your website.
The first setting is ‘Automatic HTTPS Rewrites’.
This will help you avoid the mixed content error in WordPress. It does this by automatically changing ‘http’ to ‘https’ in the URLs of all resources and links on your site that can be served with a secure ‘https’ URL.
This setting is on by default. We recommend you leave it on and click the ‘Save’ button.
The next setting is ‘Always Use HTTPS’.
Some users have reported issues when using this setting with Cloudflare. This setting is disabled by default, and we recommend you leave it that way. We will show you how to redirect from HTTP to HTTPS using the All in One SEO plugin later in this article.
Now you can click the ‘Save’ button to move on to the next option.
The next setting is Brotli compression.
Cloudflare can use Brotli compression to unlock 15-20% speed improvements. This setting is on by default, and we recommend you leave it on.
Make sure you click the ‘Save’ button to store this setting.
Now you will see a summary of what you have configured with the Quick Start Guide.
You should see:
- Automatic HTTPS Rewrites: ON
- Always Use HTTPS: OFF
- Brotli: ON
You have now completed the Quick Start Guide and can click the ‘Finish’ button. However, there are still some additional important settings that need to be configured.
Configuring Additional Important Cloudflare Settings
Your basic Cloudflare setup is complete, but there are a few essential settings you need to configure to keep your WordPress site secure.
1. Secure Your WordPress Login Page
You can set up page rules to customize how Cloudflare works on specific pages on your site. This is especially useful for securing critical pages such as the login page and wp-admin area.
The Cloudflare free account allows you to set up 3 page rules. If you want to add more page rules, then you need to pay $5 per month for 5 extra rules.
First, you need to click the ‘Rules’ option in the menu on the left of the page. After that, you can click the ‘Create Page Rule’ button.
Now you can set up 3 different page rules. You can start by creating a rule that secures your WordPress login page.
Simply add the following settings below to secure your website:
- Page URL: example.com/wp-login.php*
- Settings: Security Level – High
When you are done, just click ‘Save and Deploy’ to store and activate the rule.
2. Exclude the WordPress Dashboard from Cloudflare
You will be returned to the Page Rules page, where you can see your first rule listed.
Now you can create a second rule to exclude the WordPress dashboard from Cloudflare caching and enable high security.
You’ll need to click on the ‘Create New Rule’ button to create your second rule.
After that, you need to type the following settings into the rule. You can click the ‘+ Add a Setting’ button to add new rows for additional settings:
- Page URL: example.com/wp-admin*
- Settings: Security Level – High
- Cache Level – Bypass
- Disable Performance
- Disable Apps
When you are done, make sure you click ‘Save and Deploy’ to add the new rule.
3. Configure SSL Certificate Settings
Another important setting is the SSL certificate available in the ‘SSL/TLS’ menu on the left.
Make sure to click the ‘Full’ radio button if you are already using SSL.
If you don’t have an SSL certificate, then see our guide on how to get a free SSL certificate for your website.
Once you are done, Cloudflare will provide the essential green padlock in your visitors’ address bar to signify that your website is secure.
4. Redirect from HTTP to HTTPS Using All in One SEO
We mentioned earlier that we don’t recommend using Cloudflare’s ‘Always Use HTTPS’ feature. A great alternative is to use the All in One SEO plugin. It’s the best SEO plugin for WordPress, used by over 3 million sites.
The first thing you need to do is activate and install the All in One SEO plugin. For more details, see our guide on how to install a WordPress plugin.
After that, navigate to All in One SEO » General Settings and then enter your license key into the ‘License Key’ box and click ‘Connect’.
You can find your license key in your account profile on the All in One SEO website.
Next, navigate to All in One SEO » Redirects and then click the ‘Full Site Redirects’ menu navigation option.
You will need to scroll down the page until you find the ‘Canonical Settings’ toggle. You should click this toggle so that it turns blue.
Next, turn on the ‘Redirect from HTTP to HTTPS’ toggle. This will create a redirect from HTTP to HTTPS, making sure that your visitors always have a secure connection to your website.
When you are done, make sure to click the ‘Save Changes’ button at the bottom or top of the screen to store this setting.
Optimizing Cloudflare for WordPress Using a Plugin
Cloudflare offers a dedicated WordPress plugin for one-click WordPress-optimized settings.
The plugin lets you quickly set up Cloudflare on your WordPress site, add web application firewall (WAF) rulesets, automatically purge the cache, and more.
To get started, install and activate the Cloudflare plugin on your website. For more details, see our step-by-step guide on how to install a WordPress plugin.
Once done, you need to visit Settings » Cloudflare in your admin panel to configure the Cloudflare settings.
On the settings page, you will see a ‘Create Your Free Account’ button and a sign-in option for existing accounts. Simply click the ‘Sign in here’ link.
On the next screen, you will need to enter your Cloudflare email and API key.
Click the ‘Get your API key from here’ link.
This will bring up a popup for your account area on the Cloudflare website.
Make sure you are on your ‘My Profile’ page, and then click on the ‘API Tokens’ tab in the left sidebar.
After that, go to the ‘Global API Key’ section and click on the ‘View’ button.
This will open a popup and display your API key.
Simply click on the key to copy it.
Next, you need to come back to your WordPress dashboard and enter your email address and API key.
Then, click the ‘Save API Credentials’ button.
After that, the Cloudflare settings will appear on your dashboard.
From here, you can apply a single-click WordPress optimization, purge the cache, enable automatic cache, and more.
To optimize your WordPress site, just click the ‘Apply’ button next to ‘Apply Default Settings’.
Next, click on the ‘Settings’ menu option.
Here you will find more site optimization settings.
You can scroll down on this screen to find the ‘Security’ section.
By default, the security level is medium. To improve your website’s security, you can select ‘High’ from the dropdown list.
About Z Square Studio
At Z Square Studio, we are not just a design and marketing studio; we are a team of passionate creatives dedicated to delivering excellence in every project we undertake. Our journey is fueled by the desire to transform ideas into visual masterpieces, captivating digital experiences, and effective marketing strategies. With a firm belief that excellence is not just a goal, but a standard, we redefine the realms of graphic design, web design, and digital marketing.
Graphic Design: Elevating Visual Communication
Our graphic design services go beyond aesthetics. We understand that design is a powerful language that speaks to your audience on a profound level. From brand identity to promotional materials, we craft visuals that resonate with your brand’s essence. Our commitment to excellence drives us to meticulously create designs that are not only visually appealing but also convey messages with impact. With a blend of creativity and strategic thinking, we transform concepts into designs that leave a lasting impression.
Web Design and Development: Crafting Digital Experiences
In the digital age, your website is often the first point of contact with your audience. Our web design services are centered around creating user-centric experiences that seamlessly blend aesthetics with functionality. Excellence in web design means striking the perfect balance between captivating visuals, intuitive navigation, and responsive performance. Whether it’s a sleek portfolio, an e-commerce platform, or a corporate website, we infuse excellence into every pixel to ensure your online presence leaves an indelible mark.
Digital Marketing: Strategies That Shine
Digital marketing is more than just boosting visibility; it’s about creating connections. Our digital marketing services are driven by a commitment to excellence in strategy and execution. We develop tailored campaigns that not only drive traffic but also engage and convert. From SEO and social media marketing to content creation and analytics, our approach is rooted in staying ahead of the digital curve. We believe that excellence in digital marketing lies in the ability to adapt, innovate, and consistently deliver results.
Where Excellence Is the Cornerstone
At Z Square Studio, excellence is not an option – it’s a cornerstone of everything we do. Our passion for design, web development, and digital marketing is matched only by our dedication to exceeding expectations. Every project we undertake is a canvas for us to showcase our commitment to excellence, pushing boundaries and crafting solutions that stand out in a crowded digital landscape. When you partner with Z Square Studio, you’re not just getting services; you’re getting a promise of excellence that goes beyond the ordinary, turning your vision into a reality that resonates and engages.
