Website & Strategy
Cloudflare CDN Setup Guide for Beginners
Your site is optimized, your images are compressed, and your database is clean. Yet one major lever remains that many site owners overlook: the geographic distribution of your resources. If you followed our Core Web Vitals 2026 guide and your LCP is still resisting optimization, a misconfigured or missing CDN is often the missing piece.
Cloudflare is now the most accessible CDN solution on the market. Its free plan covers virtually all the needs of a small business site or portfolio, and its setup requires no advanced server skills. This guide walks you step by step, from creating your account to verifying that your resources are being delivered from Cloudflare's global network.
Why a CDN is essential for your Core Web Vitals
Without a CDN, every visitor to your site loads your resources from a single server located in a specific datacenter. A visitor from Lyon or Bordeaux accessing a server hosted in Amsterdam or the United States experiences unavoidable network latency, regardless of the quality of your hosting.
A CDN solves this problem by replicating your static assets (images, CSS, JavaScript, fonts) across a network of servers distributed around the world. Cloudflare has more than 300 points of presence (PoPs) in over 100 countries. The result: each visitor is served from the nearest node, with latency reduced to a minimum.
Direct impact on your metrics:
LCP: images and CSS files served from a nearby node load significantly faster
TTFB: Cloudflare caches HTML responses and reduces the number of requests reaching your origin server
Security: Cloudflare filters malicious traffic, DDoS attacks, and bots before they reach your server
Step 1: Create your Cloudflare account
Go to cloudflare.com and create a free account with your professional email address. The Free plan is enough to get started and includes CDN, SSL, basic DDoS protection, and analytics.
Once you're logged in, click "Add a site" and enter your site's domain (example: your-site.fr). Cloudflare will run an automatic scan of your existing DNS records. This step usually takes less than 60 seconds.
Step 2: Verify and import your DNS records
This is the most critical step. Cloudflare automatically detects your existing DNS records (A, CNAME, MX, TXT) and offers to import them. Check carefully that all your records are present before continuing.
Key points to watch:
Make sure the A record pointing to your server's IP address is present
Make sure your MX records (for email) are imported correctly
Check the TXT records used for Google Search Console or your email tool
The small orange cloud next to a DNS record indicates that traffic goes through Cloudflare (proxy mode enabled). The gray cloud indicates DNS-only mode, without a proxy. To benefit from the CDN and protection, the cloud must be orange for your main A and CNAME records.
Step 3: Change your DNS servers at your registrar
Cloudflare provides you with two customized nameservers, for example:
Log in to your domain registrar's interface (OVH, Gandi, Namecheap, etc.) and replace the current DNS servers with the ones provided by Cloudflare. DNS propagation usually takes between 15 minutes and 24 hours. Cloudflare will send you a confirmation email as soon as the change is detected.
Tip: do not delete your old nameservers before adding the new ones. Replace them directly to avoid any service interruption.
Step 4: Configure SSL and HTTPS redirects
In the Cloudflare dashboard, go to SSL/TLS and select the "Full (strict)" mode if your server already has a valid SSL certificate. If your hosting does not natively support SSL, use "Flexible" mode at first.
Then enable the following options in SSL/TLS > Edge Certificates:
Always Use HTTPS: automatically redirects all HTTP traffic to HTTPS
Automatic HTTPS Rewrites: fixes mixed links (resources loaded over HTTP on an HTTPS page)
HTTP Strict Transport Security (HSTS): enable only if you're certain you will keep HTTPS indefinitely
Step 5: Optimize cache rules
This is where Cloudflare becomes truly powerful for your Core Web Vitals. Go to Caching > Configuration and set up the following settings.
Browser Cache TTL Set the browser cache duration to 1 year for static assets. Cloudflare passes this directive to your visitors' browsers, which no longer re-download assets already in cache on subsequent visits.
Caching Level Select "Standard." This level caches static assets while respecting your origin server's cache settings.
Always Online Enable this option. If your origin server is temporarily unavailable, Cloudflare serves a cached version of your site instead of an error page.
Cache Rules for WordPress
On WordPress, create a cache rule to exclude dynamic pages from the Cloudflare cache:
In Rules > Cache Rules, create a rule with the following condition:
Action: Bypass cache
This prevents admin pages or logged-in user sessions from being served from cache.
Step 6: Enable performance optimizations
In the Speed > Optimization tab, enable the following options:
Auto Minify Check CSS, JavaScript, and HTML. Cloudflare automatically minifies your assets on the fly without modifying the files on your server.
Brotli Enable Brotli compression. More efficient than gzip, it reduces the size of text-based assets (HTML, CSS, JS) by an additional 15 to 25%.
Rocket Loader (optional) Cloudflare offers Rocket Loader to defer JavaScript loading. Test this option carefully on WordPress, as it may interfere with some plugins. Enable it, measure the impact with PageSpeed Insights, and disable it if it causes errors.
Step 7: Integrate Cloudflare with WordPress
To make WordPress and Cloudflare work together smoothly, install the official Cloudflare plugin from the WordPress repository. It lets you:
Purge the Cloudflare cache directly from the WordPress dashboard
Apply the recommended cache rules automatically
Synchronize security settings
If you use WP Rocket, go to the CDN tab and enable the Cloudflare integration. WP Rocket will automatically rewrite your static asset URLs to serve them from the Cloudflare network.
Final check: in Chrome DevTools > Network, reload your page and inspect the response headers of an image or CSS file. The presence of the cf-cache-status: HIT header confirms that the resource is being served from the Cloudflare cache.
Going further
Cloudflare setup is part of a complete performance strategy:
Check out our Core Web Vitals 2026 guide to understand how the CDN fits into the overall set of essential Web signals
Learn how to optimize LCP on WordPress to combine the benefits of the CDN with image optimization and preload
Learn how to clean up your WordPress database to reduce TTFB upstream, before Cloudflare even comes into play
In summary
Setting up Cloudflare on your site is not an operation reserved for experienced developers. In seven structured steps, you can deploy a global CDN, secure your HTTPS connections, optimize your cache, and significantly reduce your LCP. Cloudflare's free plan is enough for most small business sites and portfolios. And if your needs grow, the Pro and Business plans add advanced cache rules, a full WAF, and detailed analytics. Start with the essentials, measure the impact, and adjust.
FAQ
Is Cloudflare Free enough to improve my Core Web Vitals? Yes, for the vast majority of sites. The free plan includes the CDN with more than 300 points of presence, DDoS protection, automatic SSL, asset minification, and basic cache rules. These features cover the essential LCP and TTFB optimization needs for a showcase site or an active WordPress blog.
Can Cloudflare break my WordPress site? The risk exists if the configuration is incorrect, especially with Rocket Loader or overly aggressive cache rules that cache dynamic pages. The right approach: enable options one by one, measure the impact with PageSpeed Insights after each change, and use Cloudflare's "Development Mode" to temporarily disable cache if a problem occurs.
Can 3DH Studio set up Cloudflare for my site? Absolutely. 3DH Studio handles the complete Cloudflare setup: DNS migration, SSL configuration, custom cache rules, WordPress integration, and performance checks before and after. We make sure every setting is tailored to your technical stack to maximize the gain on your Core Web Vitals without any risk of service interruption.
