DEV Community

Cover image for How to Build a Webflow Website on a Custom Domain
Kevinleary.net
Kevinleary.net

Posted on Originally published at kevinleary.net

How to Build a Webflow Website on a Custom Domain

If you want to get a Webflow website live on your own domain, you can do it in an afternoon for $15 a month without writing any code.

Here’s exactly how I set up my demo site, webflow.kevinleary.net, from signup to a live custom domain with the basic SEO settings in place.

What It Costs

Webflow charges per site. You can build for free, but you need a paid Site plan to use your own domain.

Webflow site plans pricing

Plan Yearly Monthly Use it for
Starter Free Free Building and testing on a webflow.io address
Basic $15/mo $25/mo A simple site on your own domain
Premium $25/mo $39/mo Sites that need a blog or other CMS content

Most marketing sites can start on Basic. Upgrade to Premium when you need a blog.

Build the Site

  1. Sign up for a free account at webflow.com.
  2. Click New site and pick a blank site or a template. A template is the fastest way to start.
  3. Build your pages in the Designer. A home, about and contact page is enough to launch.
  4. Click Publish, check the webflow.io domain, and publish. This gives you a free preview link to share with your team.

Connect a Custom Domain

Webflow Publishing settings with staging and production domains

  1. Buy a Site plan under Site settings > Plans.
  2. Go to Site settings > Publishing and click Add a custom domain.
  3. Add both yourdomain.com and www.yourdomain.com.
  4. Add the DNS records Webflow gives you at your domain registrar.
  5. Click Check status until both domains connect.
  6. Make the www version the default.

The records will look something like this, but copy the exact values from your own Publishing tab:

Type Host Value
A @ 198.202.211.1
CNAME www cdn.webflow.com
TXT _webflow Verification code from Webflow

A few things that commonly go wrong:

  • Delete any old A records on @. Two A records will break the connection.
  • If you use Cloudflare, set the records to DNS only (grey cloud) until the SSL certificate is issued.
  • If Webflow says Update needed next to your domain, you’re on old DNS records and publishing is blocked until you update them. My demo site ran into this.

Basic SEO Settings

Webflow SEO settings

Open Site settings > SEO and do the following:

  1. Turn off Webflow subdomain indexing so Google doesn’t index a duplicate copy of your site on webflow.io.
  2. Leave robots.txt empty and keep search engine crawlers and AI bots allowed.
  3. Make sure Auto-generate sitemap is on, then submit /sitemap.xml in Google Search Console.
  4. In the Designer, open each page’s settings and fill in the SEO title, meta description and Open Graph image.
  5. If you’re replacing an old site, add 301 redirects under Publishing for every old URL.

While you’re in settings, add a favicon under General, set who gets form emails under Forms, and add Google Analytics or Tag Manager under Custom code.

How Webflow Is Different From a Developer Workflow

If you’re used to working with developers, Webflow will feel very different:

  • No code: you build pages visually. Custom code is optional.
  • No GitHub: changes save automatically and Webflow keeps backups you can restore.
  • No DevOps: no servers, deploys, updates or security patches. Hosting and SSL are handled for you.
  • Publish to staging or live: every time you click Publish, you choose the webflow.io domain, your real domain, or both.

The normal routine is to publish to webflow.io, get approval, then publish to your domain. Just know that publishing to your domain pushes every unpublished change on the site, not only the page you were working on.

The trade off is control. Complex integrations and custom application logic are harder in Webflow, and moving off it later means a rebuild. If you need help with a bigger build or migration, I do Webflow development.

Top comments (0)