How to Set Up Cloudflare CDN for WordPress Blog
Every second counts when it comes to a website’s loading time. If a site takes more than a few seconds to load than expected, it’ll make people abandon it almost immediately. This, in turn, affects the bounce rate, which can lead to worse search engine rankings.
People expect to get access to the information on the internet as fast as possible. Therefore, it is important to align your website’s performance with your customers’ expectations.
This article will discuss how Cloudflare CDN can help you increase your WordPress website’s loading speed. We’ll also provide a step-by-step guide on how to set it up.
What Is Cloudflare CDN?
One of Cloudflare CDN’s features is increasing website loading speed. It works by keeping multiple copies of your website’s data in proxy servers worldwide.
This means that when people want to access your content, the request is sent to servers near their location to ensure immediate processing.
Cloudflare CDN also provides security against potential DDoS attacks, ensuring data privacy for your business and customers. Additionally, it will hide your nameservers on domain registration lookup (WHOIS) tools.
How Does Cloudflare Help Your WordPress Blog?
Here are some of the key benefits of using Cloudflare for your WordPress website:
- Fast response time. Cloudflare uses edge computing, which is responsible for the efficient transfer of data from one server to another. This feature reduces the waiting time for your site visitors, improving the overall user experience.
- Site protection. Users can customize website security settings through the Cloudflare dashboard to block potential online threats. Some security features include a web application firewall (WAF) and DDoS protection.
- SSL certificate. Secure Socket Layer (SSL certificate) is a piece of software that protects website data by ensuring that only authorized computers or browsers can access it.
Cloudflare offers an SSL certification for WordPress site owners to protect client information and transactions. Users can then choose between Cloudflare’s flexible or full SSL encryption, depending on the level of security they need.
- Automatic platform optimization. Cloudflare helps to boost the overall performance of your WordPress site with automatic optimization. The process includes image resizing and automatic WordPress cache purge during website updates.
Setting Up Cloudflare on WordPress
Installing Cloudflare on your WordPress site is quick and straightforward. You can do it manually or through your hosting provider.
For example, Hostinger automatically integrates Cloudflare in their WordPress packages. This is great for site owners who want the full package needed to run a secure website without having to put much effort or thought into it.
If you’d rather install Cloudflare manually, you can do so by going for their free plan.
There are also paid plans available for those who want enhanced security and functionality. They start at $20/month and come with features like web application firewall (WAF) rulesets, mobile optimization, and DDoS alerts.
Once you have decided on a suitable plan, follow these steps to set up Cloudflare on your WordPress website.
1. Creating a Cloudflare Account
Signing up is easy and takes only a few minutes. Just make sure to have your WordPress site URL ready.
- You now have a Cloudflare account but still need to add your website to access the services.
2. Adding Domain Name to Cloudflare
- Go to your Cloudflare dashboard. Select the Add Site button.
- Add the URL of your WordPress website. Cloudflare allows its users to add as many websites as they want, even for the free version.
- Now, select your plan. If it’s for a blog or personal website, we recommend choosing the Free version. It comes with all of the needed basic features to protect your website from online threats and enhance its loading speed.
Those who run an online store or a high-traffic website can subscribe to the Pro or Business plans for maximum performance benefits. Cloudflare’s premium plans come with automatic website updates and more security options.
3. Checking the DNS Records of Your Domain Name
Once your WordPress site is added to Cloudflare, you’ll be prompted with the DNS details of the domain name. In this step, enable or disable Cloudflare for specific subdomains.
To activate, simply toggle the cloud icon to an orange color.
We highly suggest enabling Cloudflare for your naked domain name and www subdomain. This way, Cloudflare will work on both www and non-www versions of your site.
Once you are done, press Continue to proceed to the next step.
Important! It’s not recommended to enable Cloudflare for cPanel, mail, FTP, or any other subdomains as it can result in numerous DNS issues.
4. Pointing Your Domain Name to Cloudflare Nameservers
After activating Cloudflare for your domain and subdomains, you will see the Cloudflare nameservers on the next page. It is essential to replace old nameservers with Cloudflare’s.
- Access the Cloudflare nameservers by clicking on the DNS tab on the dashboard.
- Under the DNS Management section, you will see the Cloudflare nameservers assigned to your website. Copy these values.
3. Open a new browser tab and go to your hosting control panel. For Hostinger customers, you’ll find the nameservers’ details under the Domains tab.
- Under the Change nameservers section, replace both values with those from Cloudflare, then click Save.
- Go back to the Cloudflare page and press Done.
- Check the DNS tab on Cloudflare to see if the nameserver update was successful.
It may take up to 72 hours for DNS to propagate worldwide. Once the nameservers update is complete, you will receive an email confirmation from Cloudflare.
Alternatively, you can check the update status on the Cloudflare website. During this process, your page will not face any downtime.
5. Configure The HTTPS Settings
Hypertext Transfer Protocol Secure (HTTPS) secures website data through an SSL certificate. It is important to configure this setting to protect your WordPress site against potential data breaches and data leakage.
It only takes two steps to set up HTTPS.
- Go to the SSL tab on your Cloudflare dashboard. Choose Full SSL if you have an existing SSL certificate or Flexible SSL if you don’t.
Flexible SSL is for protecting data transfers between the WordPress site and Cloudflare only. Meanwhile, Full SSL provides end-to-end protection from your site to the visitor’s server.
- Head to the Edge Certificates section and turn on Always Use HTTPS. It might take a while for the changes to be visible, so check it after a few hours. Once you see a confirmation message and a padlock icon near the site’s URL, you’ll know that it’s active.
If you have a hosting plan with Hostinger, take advantage of the free SSL certificate. Find it in the Advanced section of the hPanel.
6. Installing and Configuring the Cloudflare WordPress Plugin
To finish up the process, we need to install the WordPress Cloudflare plugin for WordPress. This tool is loaded with a number of handy features to help you manage the CDN, such as:
- One-click WordPress optimization
- Web application firewall (WAF) rulesets
- Automatic cache purge
- Statistics
- Built-in Cloudflare settings for easy modification
Here is a step-by-step guide on how to install the Cloudflare WordPress plugin:
- Access your WordPress dashboard and head over to Plugins -> Add New.
- Search for the Cloudflare WordPress plugin. Install and activate it.
- Go to the Settings page and select Cloudflare.
- Select Get your API Key from here located below.
5. A new window will pop up. Go to the API Tokens tab, then select View from the Global API Key option.
6. Enter your Cloudflare password, and then copy the provided API key.
7. Go back to the plugin Settings page, and paste the API key in the login field. Hit the Save API Credentials button.
Once Cloudflare is set up and log in to the WordPress plugin, you will see several settings:
- WordPress optimized settings. Clicking Apply Recommended Cloudflare Settings will reset values for caching and security level, Auto Minify, and IP geolocation. Cloudflare will automatically apply the settings to your WordPress site to enhance its performance.
- Automatic Platform Optimization (APO). This Cloudflare plugin feature is for keeping copies of your website data to increase loading time. It ensures that clients can instantly access your content. With automatic platform optimization, Cloudflare stores both static and dynamic content in its edge network.
- Purge cache. Website caching is the process of copying the website data and placing it in temporary storage for instant access. Cache purge means that Cloudflare will delete all previously stored information so it can copy new data.
Using the Cloudflare plugin is a convenient way to manage settings within your WordPress dashboard.
Other Cloudflare Features: An In-Depth Look
There is a lot that Cloudflare has to offer. Here are just some of the additional features that Cloudflare comes with, free and paid.
1. Auto Minify
Auto Minify is a service that automatically cleans up the website’s code, making it more compact. Cloudflare does this by removing unnecessary characters on your WordPress website to boost site performance and improve user experience.
This is applicable for Javascript, CSS, and HTML and is perfect for site owners who have a lot of plugins on their WordPress site. Auto Minify is available on all Cloudflare plans.
2. Brotli
Brotli ensures quick data transfer between servers and browsers. It works by compressing files such as images, text, and font. This feature helps to boost the overall performance of your WordPress site.
To turn it on, simply head to the Speed menu and look for it under the Optimization tab. Brotli is available to all users at no cost.
3. Rocket Loader
Rocket Loader is responsible for increasing page load speeds, especially for pages that use JavaScript. It ensures that content like text, images, and fonts load correctly.
Enable this feature on the Cloudflare dashboard under the Speed tab. Use it on all pages or only specific pages of your WordPress websites.
To activate it on specific web pages only, head to the Page Rules menu, add the URL, and pick a setting.
Rocket Loader is available for all Cloudflare users for free.
4. Firewall
Cloudflare’s firewall blocks potential online attacks to keep your website’s content secure. The free version comes with DDoS protection and optimized security rules for CMS platforms like WordPress, Joomla!, and Drupal by default.
Those who want to boost the security of their WordPress site can subscribe to Cloudflare’s premium plan. It comes with a web application firewall (WAF), customizable security rules, and access to analytics reporting.
Users can configure their security settings under the Firewall tab.
5. Network
To enhance website performance, head to the Network menu of your Cloudflare dashboard. Network settings allow the use of HTTP/2 and WebSocket for enhanced site functionality.
In the Network settings page, WordPress site owners can also enable IP address geolocation to identify where their site traffic is coming from. Most network features are free except for Response Buffering and True-Client-IP-Header, which are available only for the Enterprise plan owners.
6. Page Rules
Page Rules focuses on HTTPS rewrites and preferences on particular pages of your WordPress site. This feature gives site owners complete control over Cloudflare settings.
To configure Cloudflare Page Rules, head to the dashboard, add your preferred URL, pick a setting, and hit Save. Anyone can set page rules, but the free version only allows a maximum of three.
7. Image Resizing
Image resizing is the process of minimizing image measurements to boost the performance of your WordPress site. With this service, Cloudflare also automatically adjusts images on your site to fit any device.
This feature is essential for maintaining a consistent website appearance. Moreover, smaller images require less storage space, which contributes to a faster loading time. If your WordPress website loads quickly, it can increase ranking in search results as well.
Anyone who wants to take advantage of image resizing can subscribe to a Business plan for $200/month. It comes with up to 100,000 image requests per month.
8. Mirage
Mirage increases page load speed for any type of website. It works by temporarily putting image placeholders so that visitors can see your website’s content as it is loading, instead of a blank page. This feature is handy for mobile devices that have a slow internet connection.
You can add this to our WordPress site by upgrading to a Pro plan for $20/month. The Pro plan also comes with a web application firewall, image optimizations, and DDoS protection.
9. Polish
Polish compresses images by removing unnecessary data such as the camera manufacturer or the image details. Cloudflare minimizes images in two ways – lossless and lossy.
With lossless compression, Cloudflare minimizes the images while retaining the quality. It is perfect for delivering high-quality content without sacrificing load speed.
On the other hand, lossy compression reduces the image size and quality to boost loading performance.
Cloudflare’s Polish feature also allows users to save images in WebP format, which requires less storage space than PNG and JPEG formats.
WordPress site owners can use Polish by upgrading to the Pro plan.
Cloudflare Integration With Hostinger
Hostinger users can easily configure Cloudflare from their hPanel:
- Log in to your Hostinger account to access the hPanel.
- Go to Domains and click Cloudflare.
- Complete your Cloudflare purchase and click Set up.
- You will see the Cloudflare control panel with settings for service status, SSL communication, security level, and subdomain. Select the Service status and set the SSL communication options to Full to enable end-to-end data protection.
- If applicable, choose the subdomains you want to encrypt. Once you’re done, press Save.
Managing Cloudflare through hPanel is a convenient way to keep track of domain, hosting, and security settings from one platform. Any changes you make on Cloudflare via hPanel will automatically reflect on your hosting account too.
Conclusion
A Content Delivery Network is an important service that can help you boost your site speed. Out of the many options available, we highly recommend using Cloudflare. It offers a reliable CDN service with excellent security and performance improvements.
You can set up Cloudflare on WordPress for free. Here’s a quick summary of the steps we’ve discussed in this article:
- Create your Cloudflare account.
- Add your domain name to Cloudflare.
- Check the DNS records of your domain name in Cloudflare and activate the service for your naked and www domains.
- Point your domain name to the Cloudflare nameservers.
- Configure the HTTPS settings.
- Install the WordPress Cloudflare plugin for easy configuration.
Make sure to look out for Cloudflare’s free and paid features such as one-click WordPress optimized settings, Rocket Loader, and Auto Minify to optimize your WordPress website further.
Comments
April 03 2020
I am using hostinger.in hosting service. Can I use couldflare for my can. If I change nameservers to cloudflare, will I loose Hostinger.in hosting service?
April 04 2020
Hey, you will not lose Hostinger services, make sure to follow the steps written above and everything will be alright!
April 24 2020
I have followed all above-mentioned steps but I am having an error "Domain status: not pointing to our name servers". I am using hostinger domain & hostinger hosting. Please help
April 24 2020
Hi! I am not able to locate an account with us with your email to see the exact case, but this can occur if you have not added an A record in Cloudflare. A Records are necessary to direct a visitor's browser requests to an origin web server. Access your Cloudflare Dashboard and check if the A record added there is the same as the one in your Hostinger Dashboard. You can see your Hostinger DNS records in your Panel-> Advanced-> DNS zone editor. You will find the A record you need to use there.
May 04 2020
I installed free ssl certificate from cloudflare but it is not working on my website
May 04 2020
Hey, Amit, have you followed all the steps on the tutorial?
July 11 2020
Awesome step by step guidance. thank you so much.
July 14 2020
Happy to help! :)
August 05 2020
I purchased a Cloudflare service on my Hostinger account and I have a problem to set it up. Actually my website doesn't work now and Im trying to resolve the issue. Looks like DNS settings... Please HELP!
November 06 2020
Hey there Salahaddin! Hope you are having a lovely day. Once you set up CloudFlare you may need to tweak few settings based on your DNS configuration, SSL encryption etc. My help is limited via the comments here, but if you message our support team, I am sure they can help you, if your website is hosted here :)
August 07 2020
Hi I am getting an error 1000 message. I have checked and the ftp A record is correct. The nameservers I changed both within the domain and hosting. Site launching on Monday - please help!
November 06 2020
Hey there Natasha! :) Make sure to give it 24 hours before your nameservers propagate correctly. After that make sure not only the ftp A record is correct, but the @ A record needs to point to the same IP address as well! Good luck!
August 09 2020
I done it. But i don't know why sometimes i got error my domain not pointing. Or SSH failed . . . I have to restored default my DNS. Sometime oneday my site went down 5 6 times. Could you have any other advices for me?
November 11 2020
Hey there! I am not sure what steps could a mistake appear on, but please feel free to message our support team, and I am sure they will gladly help you out! :)
August 31 2020
How to use cloudflare protection from hostinger hosting site not from the cloudflare website. I saw this in my hostinger cpanel domain ( Speed up your website and protect it against DDoS attacks for Rs. 545.00 ). Should I buy this for my website? Please help me to activate cloudflare my site.
November 06 2020
Hey there! :) You can just purchase the product and click SETUP :) Then you can chose what website do you want to attach it to and it will be active.
September 15 2020
Hi! It's a informative guide but I have a query that : Which SSL Certificate we have to activate in it (Hosinger SSL or Cloud Flare SSL) ? Or can we use both at a time ?
November 11 2020
Hey Apurb. You can use both. If you do use both - set CloudFlare's encryption to Full instead of Flexible.
September 24 2020
Thanks for the article! I have a question. Is this the same as paying Hostinger SSL ($11.95 ) and Cloudflare ($9.95)? Cheers, Jimmy
November 18 2020
Hey Jimmy. CloudFlare SSL won't replace our Hostinger's SSL, as it can't fully encrypt the connection. If you are using CloudFlare, your domain is connected to CloudFlare, and then the CloudFlare connects to your host (Hostinger). CloudFlare only has the authorization to encrypt the data between the domain and CloudFlare's servers. On the topic of CloudFlare via Hostinger, when you pay the CloudFlare protection via Hostinger, your CloudFlare will be integrated directly in your Hostinger dashboard. This makes it much easier to control, and you won't need to change the DNS at all.
November 27 2020
hey.. I got hostinger cloudflare service in my hosting plan. I did setup on my domain. Should i also have to create cloudflare accout and follow all the above steps to protect my account or not.
February 09 2021
Hi there! If you got Cloudflare from Hostinger side, all you need to do is set up the service from your Home page. You won't need to point your domain to Cloudflare.com and do all the other steps from this tutorial :) If you need any further help with it, our Customer Success team will be happy to help you out via Live Chat.
June 22 2021
There's no option to configure nameservers on hostinger cPanel plans.
September 14 2021
Hi Ricardo! If you're using a Hostinger cPanel plan, you can activate Cloudflare directly from your cPanel -> Cloudflare. In case you run into any issues doing that, feel free to contact our Customer Success team!
May 25 2022
I am trying to connect a Hostinger hosted website to an existing Cloudflare account of mine, and I am being asked for my password. When I insert that, it is being rejected as incorrect. It's funny, because I can use the very same password to connect to my Cloudflare account in a new tab. Would you kindly assist me with this?
May 31 2022
Hi there! Are you sure you're using the same email for your Hostinger account as your Cloudflare account? Maybe you have 2 Cloudflare accounts with different passwords? If not, then I would suggest to start by checking if your numlock and capslock is off. If that doesn't help, you might try changing the password. If anything, feel free to reach out to our Customer Success team anytime!