Setting Up Customized Root Area utilizing Webflow and Cloudflare



Hello everybody! ?

I attempted Webflow for the primary time a number of days in the past and fell in love with it. I’ve been programming for an excellent variety of years now and I’m pretty snug with HTML and CSS however I can’t think about constructing complicated interactions with out Webflow anymore. The grass is surprisingly principally inexperienced on the opposite facet ?


However you aren’t right here to take heed to my reward for Webflow. You might be in all probability right here since you tried to arrange a customized root area with Webflow and it failed. Possibly you additionally obtained the “Error too many redirects” error like I did once I was attempting to make it work and the Webflow College article wasn’t making a lot sense. Or perhaps you have been in a position to get the www subdomain routing to work with Webflow however need to arrange root area routing as an alternative. On this put up, I’ll undergo a number of of the errors I confronted and the way I used to be in a position to repair them and efficiently arrange root area routing.

Too many requests error

Caption: Error too many redirects

Organising a customized area on Webflow

The very first step is to go to your Webflow venture settings and add a brand new customized area:


You will note that Webflow mechanically provides the www subdomain. At this level you’ll be able to scroll to the highest of the venture settings web page and publish your web site on the brand new area you simply added:


Now we have to go to Cloudflare Dashboard and arrange our DNS data.

Organising DNS data on Cloudflare

I’m going to make use of for example area for this text.


Go forward and add the next two CNAME data on the subsequent web page:

CNAME     @
CNAME     www

The @ will mechanically convert to your root area when you enter the document. Be sure you set the Proxy standing to DNS solely. In any other case, the SSL won’t work.


It will mechanically activate CNAME flattening as we’ve got a CNAME pointing root to Webflow.


For those who have been receiving the Too many redirects error earlier than you began following this information, likelihood is that you just had additionally added the A data to Cloudflare. Your configuration might need regarded like this:


This configuration will work tremendous if you wish to have the www subdomain as the primary web site and redirect folks from root area to this subdomain. However it won’t work if you wish to use the basis area as the primary web site and redirect folks from the www subdomain to your root area.

Marking root area as default on Webflow

Now we simply must go to venture settings on Webflow and mark the basis area because the default web site:


Candy! now you simply want to attend for some time, let the DNS adjustments propagate, after which go to the newly revealed web site.


After I was attempting to attach Cloudflare with Webflow, I used to be working dig to confirm if the DNS adjustments had efficiently propagated. Nonetheless, as soon as Cloudflare began dealing with my DNS, I noticed the next error in dig output:

$ dig @                                                                                                                  

; <<>> DiG 9.10.6 <<>> @
; (1 server discovered)
;; world choices: +cmd
;; Received reply:
;; ->>HEADER<<- opcode: QUERY, standing: SERVFAIL, id: 34361
;; flags: qr rd ra; QUERY: 1, ANSWER: 0, AUTHORITY: 0, ADDITIONAL: 1

; EDNS: model: 0, flags:; udp: 1232
; OPT=15: 00 16 61 74 20 64 65 6c 65 67 61 74 69 6f 6e 20 61 73 65 63 2e 63 6f 6d 2e 70 6b 2e (" delegation")
; OPT=15: 00 17 5b 32 36 32 30 3a 34 64 3a 34 30 30 30 3a 36 32 35 39 3a 37 70 6b 20 41 ("..[2620:4d:4000:6259:7:2:0:1]:53 rcode=REFUSED for A")
;			IN	A

;; Question time: 678 msec
;; WHEN: Thu Apr 28 00:55:18 PKT 2022
;; MSG SIZE  rcvd: 140

I believed I had misconfigured Cloudflare. I’m not a DNS professional. I do know sufficient to be harmful however this REFUSED error was above my paygrade.

I attempted altering the DNS server I used to be utilizing to resolve the area and surprisingly it didn’t give the identical output:

$ dig @ 

; <<>> DiG 9.10.6 <<>> @
; (1 server discovered)
;; world choices: +cmd
;; Received reply:
;; ->>HEADER<<- opcode: QUERY, standing: NOERROR, id: 22014
;; flags: qr rd ra; QUERY: 1, ANSWER: 2, AUTHORITY: 0, ADDITIONAL: 1

; EDNS: model: 0, flags:; udp: 512
;			IN	A

;; ANSWER SECTION:		60	IN	A		60	IN	A		60	IN	A

;; Question time: 140 msec
;; WHEN: Thu Apr 28 00:55:15 PKT 2022
;; MSG SIZE  rcvd: 72

It was additionally not working in my browser and I used to be out of concepts. Then the one factor I didn’t anticipate to assist, helped. It was …ready… ? Seems once they ask to present DNS propagation a while, they aren’t saying that for no purpose. I waited and the error simply vanished. Cloudflare additionally began returning the proper outcomes because the Google DNS. So I suppose what I’m attempting to say is that for sure errors with DNS, ensure you have waited some time earlier than aimlessly looking for options. Possibly the error will resolve itself in due time.

Yet another factor, if you’re attempting to arrange Google Search Console and Google asks you to place a TXT document in your DNS data, you need to use @ because the host. They don’t specify the host once they provide the directions so I hope this helps you in case you attempt to determine that out subsequent ?


I hope this text helps prevent a while whereas attempting to combine Cloudflare and Webflow and establishing a customized root area for the latter. When you’ve got any questions/recommendations/suggestions please write them in a remark beneath or shoot me an electronic mail.

Have an excellent day! ❤️