Hosting with CloudFlare
CloudFlare is a popular hosting platform that optionally adds another layer between your site and the client (called proxying) that can add improved security, performance, availability, analytics, etc. Framer offers many of these out of the box, so typically an extra layer is only required for something very specific.
Setup
CloudFlare works well with Framer, but during the initial setup you have to disable proxy-ing (set to DNS only) so that a new certificate can be fetched. Once everything works, you can enable proxy-ing again.
See how to add custom domain to your site in the settings →
Now go to your CloudFlare account and set up your domain.
You can simply add the domains as described above. Be aware that Cloudflare uses @ for your root domain:
Now go to your CloudFlare account and set up your domain.
Make sure to set the following settings during setup:
• DNS: Proxied
• TLS/SSL: Full (Strict)
• Always Use HTTPS: Enabled
• Automatic HTTPS Rewrites: Enabled
Now for the most important part, we have to disable https / ssl for a special endpoint on the Framer site that is used to generate the SSL certificate (using Let’s Encrypt). Go to Rules → Page Rules and set the following:
Create rule for <domain>/.well-known/acme-challenge/* (where the domain is koenbok.com in this case) with the following settings:
• SSL: Off
• Automatic HTTPS Rewrites: Off
If all is set up well, it should look like this:
Now your site should be proxied via Cloudflare (the settings can take a bit of time to propagate). You can verify this in the Inspector by checking the headers of the served document:
