Blog/Cloudflare CDN Setup

How to Set Up Cloudflare CDN for WordPress

Complete step-by-step guide to setting up Cloudflare CDN for WordPress. Improve speed by 40-60% with free CDN, SSL, and caching. Includes troubleshooting and APO setup.

12 min read

Free Plan Available

20 min setup

330+ Locations

Global CDN network

40-60% Faster

Average speed improvement

Free SSL

Included on all plans

What is Cloudflare and Why Your WordPress Site Needs It

Cloudflare is a Content Delivery Network (CDN) and security service that sits between your website visitors and your hosting server. Instead of every visitor downloading files directly from your WordPress host, Cloudflare serves cached copies from 330+ data centers worldwide.

For WordPress specifically, Cloudflare provides:

Faster load times: Images, CSS, and JavaScript served from geographically closer servers (reduces latency by 300-800ms)
Free SSL certificate: Automatic HTTPS encryption (improves SEO and user trust)
DDoS protection: Blocks malicious traffic before it reaches your server
Bandwidth savings: Reduces server load by 60-80% (cached content doesn't hit your host)
Better Core Web Vitals: Improves LCP and TTFB (Google ranking signals)

Perfect for slow hosting

If you're on HostGator, Bluehost, or other budget shared hosting, Cloudflare can mask slow server response times by serving cached content from fast edge servers. It's not a replacement for good hosting, but it helps significantly. See our complete HostGator optimization guide.

Prerequisites

Before starting, ensure you have:

WordPress site with active domain name
Access to your domain registrar (where you bought your domain)
WordPress admin login credentials
15-20 minutes of uninterrupted time

Important: Backup First

While Cloudflare setup is safe, DNS changes can cause temporary downtime if misconfigured. Take a full WordPress backup before proceeding. Most hosts offer free backups via cPanel or control panel.

Step-by-Step Cloudflare Setup (10 Steps)

Create a Free Cloudflare Account

Go to cloudflare.com
Click "Sign Up" in the top right
Enter email and create password
Verify email (check spam folder if needed)

Add Your Website to Cloudflare

Tell Cloudflare which domain to protect

After logging in, click "Add a Site"
Enter your domain name (e.g., yourdomain.com — without http:// or www)
Click "Add site"

Example:

✅ bknddevelopment.com
❌ https://www.bknddevelopment.com

Select the Free Plan

Sufficient for 99% of WordPress sites

Cloudflare will show you plan options:

Free — $0/month

✅ Choose this one

Pro — $20/month

Skip unless high traffic

Business — $200/month

Enterprise only

Click "Continue with Free" at the bottom.

Review DNS Records

Cloudflare auto-imports your existing DNS — verify accuracy

Cloudflare scans your current DNS records and displays them. You should see:

A record pointing to your host's IP address
CNAME record for www subdomain
MX records (if you use email with your domain)

Orange cloud vs Gray cloud:

🟠 Orange (Proxied): Traffic goes through Cloudflare CDN (use this for your website)
⚪ Gray (DNS only): Bypasses Cloudflare (use for email, FTP, SSH subdomains)

Make sure: Your main domain (@ or yourdomain.com) and www are orange-clouded.

Click "Continue" when ready.

Update Nameservers at Your Domain Registrar

This is the most important step

Cloudflare will display two custom nameservers like:

ns1.cloudflare.com

ns2.cloudflare.com

Now go to your domain registrar (where you bought your domain: GoDaddy, Namecheap, Google Domains, etc.):

Log into your domain registrar account
Find DNS settings or Nameserver management
Replace existing nameservers with Cloudflare's two nameservers
Save changes

Common registrar locations:

GoDaddy: Domain Settings → Nameservers → Change
Namecheap: Domain List → Manage → Nameservers → Custom DNS
Google Domains: DNS → Name servers → Custom name servers

Wait for Activation

Propagation takes 5 minutes to 24 hours (usually under 30 minutes)

After updating nameservers, Cloudflare needs to detect the change. This is called "DNS propagation."

Typical time: 15-30 minutes
Maximum time: 24 hours (rare)
Status: Cloudflare will email you when activation completes

Check status: Go to Cloudflare dashboard → Overview. You'll see either "Pending" or "Active."

✅ Your site remains online during this process

Visitors can still access your website. Cloudflare doesn't cause downtime during nameserver changes.

SSL/TLS Configuration (Critical)

Once Cloudflare is active, you must configure SSL/TLS mode correctly or you'll experience redirect loops and security warnings.

Step 7: Set SSL/TLS Encryption Mode

Go to Cloudflare dashboard → SSL/TLS
Under "Overview," you'll see encryption mode options
Select the appropriate mode based on your hosting:

Full (strict) — RECOMMENDED

Use if: Your host provides an SSL certificate (most shared hosting does: SiteGround, Kinsta, WP Engine, Cloudways, etc.)

How it works: Cloudflare encrypts traffic from visitors to Cloudflare, and from Cloudflare to your origin server using a valid SSL certificate.

Full — ACCEPTABLE

Use if: Your host doesn't provide SSL (rare), or you have a self-signed certificate

How it works: Cloudflare encrypts visitor traffic but accepts self-signed/invalid certificates from your origin.

Flexible — NEVER USE

Problem: Traffic from Cloudflare to your server is unencrypted (HTTP), creating security vulnerabilities

Causes: Redirect loops, mixed content warnings, and insecure connection warnings

Step 8: Enable Always Use HTTPS

Stay in SSL/TLS section
Go to "Edge Certificates" tab
Toggle "Always Use HTTPS" to ON
Toggle "Automatic HTTPS Rewrites" to ON

This ensures all HTTP requests automatically redirect to HTTPS (important for SEO and security).

Speed Optimization Settings

Step 9: Enable Auto Minify

Minification removes whitespace and comments from code files, reducing file sizes by 20-40%.

Go to Cloudflare dashboard → Speed → Optimization
Scroll to "Auto Minify"
Check all three boxes: JavaScript, CSS, HTML
Save

⚠️ If your site breaks:

Disable "Auto Minify" for JavaScript only. Some plugins (sliders, page builders) conflict with aggressive JavaScript minification. CSS and HTML minification rarely cause issues.

Step 10: Enable Brotli Compression

Brotli compresses files 15-20% better than GZIP, reducing bandwidth and improving load times.

Stay in Speed → Optimization
Toggle "Brotli" to ON

Benefit: A 500 KB JavaScript file compresses to ~125 KB with GZIP, or ~105 KB with Brotli (20 KB savings).

Optional: Rocket Loader (Advanced)

Rocket Loader delays JavaScript execution until after page renders, improving perceived speed.

Location: Speed → Optimization → Rocket Loader

⚠️ Warning: May break JavaScript

Rocket Loader aggressively defers all JavaScript and can break forms, shopping carts, and interactive elements. Only enable if you're comfortable troubleshooting. Most users should skip this.

Cloudflare APO (Automatic Platform Optimization)

APO is a $5/month add-on that dramatically improves WordPress performance by caching HTML pages at Cloudflare's edge servers.

✅ You Should Get APO If:

On slow hosting (HostGator, Bluehost, EIG hosts)
TTFB consistently above 800ms
High international traffic
Need best possible Core Web Vitals

⏭️ You Can Skip APO If:

On fast managed hosting (Kinsta, WP Engine, Rocket.net)
TTFB already under 400ms
Mostly US traffic
Budget-conscious

How to Enable APO

Go to Cloudflare dashboard → Speed → Optimization
Scroll to "Automatic Platform Optimization"
Click "Subscribe" ($5/month)
Install the official Cloudflare WordPress plugin
Connect the plugin to your Cloudflare account (API token required)
Enable "Automatic Cache Purge" so WordPress clears Cloudflare cache when you publish/update content

Expected improvement with APO:

• TTFB: 400-800ms reduction (from 1200ms to 300ms typical)
• LCP: 500-1000ms faster
• Server load: Reduced by 90%+ (almost all requests served from edge)

Common Issues & Troubleshooting

Issue: Redirect Loop (Too Many Redirects)

Symptom: Website shows "ERR_TOO_MANY_REDIRECTS" or "redirect loop detected"

Cause: SSL/TLS mode set to "Flexible" while WordPress forces HTTPS

Fix:

Go to Cloudflare → SSL/TLS
Change mode to "Full" or "Full (strict)"
Wait 5 minutes and clear browser cache
If still occurring, temporarily disable "Always Use HTTPS" in Edge Certificates

Issue: Mixed Content Warnings

Symptom: Browser shows "Not Secure" or "Mixed Content" warning despite Cloudflare SSL

Cause: Page loads HTTPS but includes HTTP resources (images, scripts, stylesheets with http:// URLs)

Fix:

Enable "Automatic HTTPS Rewrites" in Cloudflare → SSL/TLS → Edge Certificates
Install Really Simple SSL plugin in WordPress
Run database search-replace to update http:// to https:// (use Better Search Replace plugin)

Issue: Can't Login to WordPress Admin

Symptom: Login page redirects endlessly or shows blank screen

Cause: Cloudflare caching admin pages or cookies being blocked

Fix: Create Page Rule to bypass cache for admin:

Go to Cloudflare → Rules → Page Rules
Click "Create Page Rule"
URL pattern: *yourdomain.com/wp-admin/*
Setting: "Cache Level" → "Bypass"
Add another rule for: *yourdomain.com/wp-login.php
Save and deploy

Issue: Changes Don't Appear on Site

Symptom: Updated content, changed images, or edited CSS but old version still shows

Cause: Cloudflare serving cached version

Fix: Clear Cloudflare cache:

Go to Cloudflare → Caching → Configuration
Click "Purge Everything"
Wait 30 seconds and hard-refresh browser (Ctrl+Shift+R)
For future: Install Cloudflare WordPress plugin for automatic cache clearing

Frequently Asked Questions

Is Cloudflare free for WordPress?

Yes. Cloudflare's Free plan includes CDN, SSL certificate, DDoS protection, and basic caching. This is sufficient for most WordPress sites. Paid plans ($20-200/month) add features like image optimization, advanced WAF, and APO (Automatic Platform Optimization).

Will Cloudflare speed up my WordPress site?

Yes. Cloudflare typically improves WordPress speed by 40-60% for international visitors and 20-30% for local visitors. The CDN serves static assets (images, CSS, JS) from 330+ global locations, reducing latency. Combined with a caching plugin, you can achieve 70-80% faster load times.

Should I use Cloudflare with a caching plugin?

Yes. Cloudflare handles CDN (static asset delivery) while WordPress caching plugins handle page caching and optimization. Use both for optimal performance. Compatible plugins: WP Rocket, FlyingPress, W3 Total Cache, WP Super Cache, LiteSpeed Cache.

What is Cloudflare APO and do I need it?

APO (Automatic Platform Optimization) is a $5/month add-on that caches HTML pages at Cloudflare's edge, bypassing your origin server entirely. It dramatically improves TTFB (Time To First Byte). Worth it for high-traffic sites or slow hosting (HostGator, Bluehost).

Can I use Cloudflare with HostGator?

Yes. Cloudflare works with any hosting provider. For HostGator users, Cloudflare is especially beneficial because it offloads traffic from HostGator's slow servers. Expect 50-70% improvement in international load times.

Your WordPress Site is Now Protected and Accelerated

Congratulations! Your WordPress site is now running through Cloudflare's global CDN network, protected by enterprise-grade security, and serving content 40-60% faster to visitors worldwide.

Next steps to maximize performance:

Install a WordPress caching plugin (WP Rocket or FlyingPress)
Optimize your images (WebP format, under 100 KB)
Follow our complete Core Web Vitals optimization guide
Consider APO ($5/month) if on slow hosting

If you're still experiencing slow load times after Cloudflare and caching, the problem is likely your hosting. Read our complete HostGator optimization guide or consider migrating to faster hosting.

Need Professional WordPress Speed Optimization?

BKND Development specializes in WordPress performance optimization, Cloudflare configuration, and Core Web Vitals compliance for businesses in Union County, NJ.

Call (973) 518-5600 View Our Services

Blog/Cloudflare CDN Setup

How to Set Up Cloudflare CDN for WordPress

Complete step-by-step guide to setting up Cloudflare CDN for WordPress. Improve speed by 40-60% with free CDN, SSL, and caching. Includes troubleshooting and APO setup.

12 min read

Free Plan Available

20 min setup

330+ Locations

Global CDN network

40-60% Faster

Average speed improvement

Free SSL

Included on all plans

What is Cloudflare and Why Your WordPress Site Needs It

For WordPress specifically, Cloudflare provides:

Faster load times: Images, CSS, and JavaScript served from geographically closer servers (reduces latency by 300-800ms)
Free SSL certificate: Automatic HTTPS encryption (improves SEO and user trust)
DDoS protection: Blocks malicious traffic before it reaches your server
Bandwidth savings: Reduces server load by 60-80% (cached content doesn't hit your host)
Better Core Web Vitals: Improves LCP and TTFB (Google ranking signals)

Perfect for slow hosting

Prerequisites

Before starting, ensure you have:

WordPress site with active domain name
Access to your domain registrar (where you bought your domain)
WordPress admin login credentials
15-20 minutes of uninterrupted time

Important: Backup First

While Cloudflare setup is safe, DNS changes can cause temporary downtime if misconfigured. Take a full WordPress backup before proceeding. Most hosts offer free backups via cPanel or control panel.

Step-by-Step Cloudflare Setup (10 Steps)

Create a Free Cloudflare Account

Go to cloudflare.com
Click "Sign Up" in the top right
Enter email and create password
Verify email (check spam folder if needed)

Add Your Website to Cloudflare

Tell Cloudflare which domain to protect

After logging in, click "Add a Site"
Enter your domain name (e.g., yourdomain.com — without http:// or www)
Click "Add site"

Example:

✅ bknddevelopment.com
❌ https://www.bknddevelopment.com

Select the Free Plan

Sufficient for 99% of WordPress sites

Cloudflare will show you plan options:

Free — $0/month

✅ Choose this one

Pro — $20/month

Skip unless high traffic

Business — $200/month

Enterprise only

Click "Continue with Free" at the bottom.

Review DNS Records

Cloudflare auto-imports your existing DNS — verify accuracy

Cloudflare scans your current DNS records and displays them. You should see:

A record pointing to your host's IP address
CNAME record for www subdomain
MX records (if you use email with your domain)

Orange cloud vs Gray cloud:

🟠 Orange (Proxied): Traffic goes through Cloudflare CDN (use this for your website)
⚪ Gray (DNS only): Bypasses Cloudflare (use for email, FTP, SSH subdomains)

Make sure: Your main domain (@ or yourdomain.com) and www are orange-clouded.

Click "Continue" when ready.

Update Nameservers at Your Domain Registrar

This is the most important step

Cloudflare will display two custom nameservers like:

ns1.cloudflare.com

ns2.cloudflare.com

Now go to your domain registrar (where you bought your domain: GoDaddy, Namecheap, Google Domains, etc.):

Log into your domain registrar account
Find DNS settings or Nameserver management
Replace existing nameservers with Cloudflare's two nameservers
Save changes

Common registrar locations:

GoDaddy: Domain Settings → Nameservers → Change
Namecheap: Domain List → Manage → Nameservers → Custom DNS
Google Domains: DNS → Name servers → Custom name servers

Wait for Activation

Propagation takes 5 minutes to 24 hours (usually under 30 minutes)

After updating nameservers, Cloudflare needs to detect the change. This is called "DNS propagation."

Typical time: 15-30 minutes
Maximum time: 24 hours (rare)
Status: Cloudflare will email you when activation completes

Check status: Go to Cloudflare dashboard → Overview. You'll see either "Pending" or "Active."

✅ Your site remains online during this process

Visitors can still access your website. Cloudflare doesn't cause downtime during nameserver changes.

SSL/TLS Configuration (Critical)

Once Cloudflare is active, you must configure SSL/TLS mode correctly or you'll experience redirect loops and security warnings.

Step 7: Set SSL/TLS Encryption Mode

Go to Cloudflare dashboard → SSL/TLS
Under "Overview," you'll see encryption mode options
Select the appropriate mode based on your hosting:

Full (strict) — RECOMMENDED

Use if: Your host provides an SSL certificate (most shared hosting does: SiteGround, Kinsta, WP Engine, Cloudways, etc.)

How it works: Cloudflare encrypts traffic from visitors to Cloudflare, and from Cloudflare to your origin server using a valid SSL certificate.

Full — ACCEPTABLE

Use if: Your host doesn't provide SSL (rare), or you have a self-signed certificate

How it works: Cloudflare encrypts visitor traffic but accepts self-signed/invalid certificates from your origin.

Flexible — NEVER USE

Problem: Traffic from Cloudflare to your server is unencrypted (HTTP), creating security vulnerabilities

Causes: Redirect loops, mixed content warnings, and insecure connection warnings

Step 8: Enable Always Use HTTPS

Stay in SSL/TLS section
Go to "Edge Certificates" tab
Toggle "Always Use HTTPS" to ON
Toggle "Automatic HTTPS Rewrites" to ON

This ensures all HTTP requests automatically redirect to HTTPS (important for SEO and security).

Speed Optimization Settings

Step 9: Enable Auto Minify

Minification removes whitespace and comments from code files, reducing file sizes by 20-40%.

Go to Cloudflare dashboard → Speed → Optimization
Scroll to "Auto Minify"
Check all three boxes: JavaScript, CSS, HTML
Save

⚠️ If your site breaks:

Disable "Auto Minify" for JavaScript only. Some plugins (sliders, page builders) conflict with aggressive JavaScript minification. CSS and HTML minification rarely cause issues.

Step 10: Enable Brotli Compression

Brotli compresses files 15-20% better than GZIP, reducing bandwidth and improving load times.

Stay in Speed → Optimization
Toggle "Brotli" to ON

Benefit: A 500 KB JavaScript file compresses to ~125 KB with GZIP, or ~105 KB with Brotli (20 KB savings).

Optional: Rocket Loader (Advanced)

Rocket Loader delays JavaScript execution until after page renders, improving perceived speed.

Location: Speed → Optimization → Rocket Loader

⚠️ Warning: May break JavaScript

Rocket Loader aggressively defers all JavaScript and can break forms, shopping carts, and interactive elements. Only enable if you're comfortable troubleshooting. Most users should skip this.

Cloudflare APO (Automatic Platform Optimization)

APO is a $5/month add-on that dramatically improves WordPress performance by caching HTML pages at Cloudflare's edge servers.

✅ You Should Get APO If:

On slow hosting (HostGator, Bluehost, EIG hosts)
TTFB consistently above 800ms
High international traffic
Need best possible Core Web Vitals

⏭️ You Can Skip APO If:

On fast managed hosting (Kinsta, WP Engine, Rocket.net)
TTFB already under 400ms
Mostly US traffic
Budget-conscious

How to Enable APO

Go to Cloudflare dashboard → Speed → Optimization
Scroll to "Automatic Platform Optimization"
Click "Subscribe" ($5/month)
Install the official Cloudflare WordPress plugin
Connect the plugin to your Cloudflare account (API token required)
Enable "Automatic Cache Purge" so WordPress clears Cloudflare cache when you publish/update content

Expected improvement with APO:

• TTFB: 400-800ms reduction (from 1200ms to 300ms typical)
• LCP: 500-1000ms faster
• Server load: Reduced by 90%+ (almost all requests served from edge)

Common Issues & Troubleshooting

Issue: Redirect Loop (Too Many Redirects)

Symptom: Website shows "ERR_TOO_MANY_REDIRECTS" or "redirect loop detected"

Cause: SSL/TLS mode set to "Flexible" while WordPress forces HTTPS

Fix:

Go to Cloudflare → SSL/TLS
Change mode to "Full" or "Full (strict)"
Wait 5 minutes and clear browser cache
If still occurring, temporarily disable "Always Use HTTPS" in Edge Certificates

Issue: Mixed Content Warnings

Symptom: Browser shows "Not Secure" or "Mixed Content" warning despite Cloudflare SSL

Cause: Page loads HTTPS but includes HTTP resources (images, scripts, stylesheets with http:// URLs)

Fix:

Enable "Automatic HTTPS Rewrites" in Cloudflare → SSL/TLS → Edge Certificates
Install Really Simple SSL plugin in WordPress
Run database search-replace to update http:// to https:// (use Better Search Replace plugin)

Issue: Can't Login to WordPress Admin

Symptom: Login page redirects endlessly or shows blank screen

Cause: Cloudflare caching admin pages or cookies being blocked

Fix: Create Page Rule to bypass cache for admin:

Go to Cloudflare → Rules → Page Rules
Click "Create Page Rule"
URL pattern: *yourdomain.com/wp-admin/*
Setting: "Cache Level" → "Bypass"
Add another rule for: *yourdomain.com/wp-login.php
Save and deploy

Issue: Changes Don't Appear on Site

Symptom: Updated content, changed images, or edited CSS but old version still shows

Cause: Cloudflare serving cached version

Fix: Clear Cloudflare cache:

Go to Cloudflare → Caching → Configuration
Click "Purge Everything"
Wait 30 seconds and hard-refresh browser (Ctrl+Shift+R)
For future: Install Cloudflare WordPress plugin for automatic cache clearing

Frequently Asked Questions

Is Cloudflare free for WordPress?

Will Cloudflare speed up my WordPress site?

Should I use Cloudflare with a caching plugin?

What is Cloudflare APO and do I need it?

Can I use Cloudflare with HostGator?

Your WordPress Site is Now Protected and Accelerated

Congratulations! Your WordPress site is now running through Cloudflare's global CDN network, protected by enterprise-grade security, and serving content 40-60% faster to visitors worldwide.

Next steps to maximize performance:

Install a WordPress caching plugin (WP Rocket or FlyingPress)
Optimize your images (WebP format, under 100 KB)
Follow our complete Core Web Vitals optimization guide
Consider APO ($5/month) if on slow hosting

If you're still experiencing slow load times after Cloudflare and caching, the problem is likely your hosting. Read our complete HostGator optimization guide or consider migrating to faster hosting.

Need Professional WordPress Speed Optimization?

BKND Development specializes in WordPress performance optimization, Cloudflare configuration, and Core Web Vitals compliance for businesses in Union County, NJ.

Call (973) 518-5600 View Our Services