TUTORIAL – How to link a custom domain to a WeWeb app

Thanks for the suggestion @jaredgibb . That did the trick. Much appreciated.

@Joyce - adding cloudflare as a suggested workaround for ‘naked’ domain redirects to your ‘Domain page’ setup instructions would be a great idea. Would save others having to search for this kind of solution as not all registrars offer a naked domain workaround in-house (for example NameCheap)

1 Like

Thanks for your reply :+1: The issue was with https not http. Not all domain registrars have the ability to provide naked domain redirects (for example NameCheap) for https (as their redirect server can’t provide SSL service), so going with a 3rd party DNS service (like CloudFlare) solved this issue. CloudFlare has all the bells and whistles for redirecting.

Thanks for the feedback, Alexander! Can you clarify how you think we could improve the documentation?

By adding a note in the “Namecheap” section in the user docs to explain that they don’t allow naked domain redirects? Or were you thinking of something else?

Thanks for replying @Joyce :smiley:
I’d suggest adding a note directly to the location where you add your domain redirect, and link to the documentation which should be updated to include at least one workaround (solution) for the lack of native naked domain support (e.g. Cloudflare will do this on their free plan).

1 Like

@Alexander_L could you elaborate on this a bit more? I found myself in the exact situation as you when officially migrating to WeWeb and have lost a ton of traffic because a lot of people are trying to access the https naked domain and it’s a dead page.

Namecheap is telling me not to use the SSL that WeWeb provides and to use theirs, but I don’t think they fully understand the scenario.

In regards to Cloudflare, did your solution involve you moving your domain from Namecheap to Cloudflare and then re-setting it up from there?

So I’ve been messing around with Cloudflare tonight and believe I’ve got it all sorted out. For anybody in the future who is reading this, here is what you do:

  1. Create a free Cloudflare account.

  2. Click on “Websites” on the sidebar and add your domain.

  3. It should auto detect all of your existing DNS settings and then provide you with two new addresses. Go into Namecheap, manage your domain, and then under “Nameservers” you’re going to select “Custom DNS”. That is where you then enter the two new nameserver addresses.

Took about 3-5 minutes for propagation to complete but once it did, Cloudflare immediately took over with all of my DNS settings in place. To be clear, my domain is still though Namecheap, I’m just now using Cloudflare to manage the DNS settings.

  1. While still in your Website settings on Cloudflare, click on Rules > Page Rules in the sidebar.

  1. In the “If the URL matches” field, enter: http://*yourdomain.com/* and https://*yourdomain.com/* (You might need to create two separate rules for http and https versions)
  2. From the “Then the settings are:” dropdown, choose “Forwarding URL.”
  3. From the next dropdown that appears, choose “301 - Permanent Redirect.”
  4. In the text field that appears, enter https://www.yourdomain.com/$1
  5. Click on “Save and Deploy.”

NOTE: Adding the $1 after the / is important because it’s a wildcard. Otherwise if someone typed in domain.com/blog it would just redirect to www.domain.com. By adding the $1, domain.com/blog would redirect to www.domain.com/blog.

After that my own devices took about 30 minutes to see a working change. However, up until then I could see pretty quickly that it was redirecting properly by using tools like httpstatus.io which showed me it was working.

Problem now solved and I feel like the initial page load when visiting the site is way snappier, but perhaps that’s all in my head :sweat_smile:

6 Likes

Hi @brandon ! Sorry for the late reply and I’m glad you figured it out on your own. I just checked over my cloudflare settings and that is exactly what I did.

Note: this change (using a 301 redirect) will likely cause your Google Search console to throw out some page indexing errors (‘Redirect error’) on the naked domain. Very likely this won’t matter, as your https://www.yourdomain.com/whatever is still getting indexed - so it will show in search results.

Wow really cool tutorial @brandon :wave:

Do you mind if we add this to our docs?

Yeah, no problem!

Here is an updated screenshot that shows that only that first redirect needs to be setup (originally you can see I have two setup):

The issue with the second redirect was that it was causing issues with other subdomains, such as my custom Xano domain. So as long as the user setups up that initial redirect, they should be able to have everything solved.

@Joyce I just tried this. Will not work this way with bluehost. Speifically, bluehost wont allow any CNAME record to have the . at the end from this value. Where do i go from here?


c

UPDATE: @Joyce So, I tested in Namecheap (registrar only) and apparently the CNAME records work there. However, I assume that WEWEB provides the hosting? Otherwise, I shouldnt be adding these in namecheap, I should be adding them in a hosting provider. Sound right?

If thats the case, I guess its propagating and we are good to go!

Hi @Jonny :wave:

First up, thanks for flagging the Bluehost thing, never had that feedback before. We’ll check it out

Yes :slight_smile:

If you already had things setup with a hosting provider, you might still need to make sure you don’t have conflicting CNAME records pointing to other places.

How did it go? All good?

@Joyce Thank you for this tutorial. I am having a problem in that I already have a CNAME www record in my DNS settings for Framer, which is hosting our landing page. The URL for that page is www.pro-tier.com. All subpages of that (e.g. www.pro-tier.com/account) are WeWeb pages. How do I configure my DNS so that both Framer and WeWeb are handled correctly?

Thanks!

ChatGPT recommended creating a subdomain for the WeWeb pages, so I created app.pro-tier.com. Seems to be working.

That is the correct approach :+1:

2 Likes

Nicely done @Dorian :raised_hands:

Indeed, if you’re already using the www subdomain for your Framer website, you need to host your app on separate subdomain. For example, app like you did.

Whenever you publish a new project, you’ll need a new subdomain. That’s why we have academy.weweb.io and feedback.weweb.io for example.

1 Like

@Jonny I had the same issue with Name — removing the period at the end of the CNAME value(s) worked for me.

1 Like

i can confirm that this doc works Add a custom domain | WeWeb documentation

1 Like