Publishing with Framer Subdomains

1. Instant Gratification: Publishing to a Framer Subdomain

Framer makes it incredibly simple to get your site online. With a single click, you can publish to a free subdomain provided by Framer. This will look something like yourname.framer.website. It's a fantastic way to go live without any cost or technical setup.

The process is straightforward. Let's watch the first minute of this official video from Framer to see it in action.

As you saw, publishing is as simple as hitting a button. When you do, you'll be presented with a choice.

Notice that you have a few different endings to choose from (.framer.website, .framer.photos, etc.). This gives you a little flexibility in branding your free site.

Anytime you make changes to your project, you just hit the "Update" button in the same top-right corner, and your changes will be live on your subdomain almost instantly.

Activity (5 minutes)

Now it's your turn.

1. Open your Framer project.
2. Click the Publish button in the top right.
3. Choose the "Get a free Framer subdomain" option.
4. Enter a name for your site and select one of the available domain endings.
5. Click Submit and visit your live website!

You now have a live URL you can use to view your site from any device.

2. The Professional Step: Connecting a Custom Domain

While a Framer subdomain is great for getting started, a custom domain (yourbrand.com) is essential for building a professional brand and a serious business. It looks more credible, is easier for people to remember, and you own it completely.

Connecting a custom domain is a three-step process:

1. Purchase a domain: You buy a domain name from a company called a domain registrar.
2. Configure Framer: You tell Framer which domain you want to connect.
3. Configure your Registrar: You log in to your registrar and add settings that point your domain to Framer's servers.

This third step involves editing something called DNS records.

Demystifying DNS

Think of the Domain Name System (DNS) as the internet's phone book. It translates human-friendly domain names (like google.com) into computer-friendly IP addresses (like 142.250.191.78). When you connect a custom domain, you're just creating a new entry in this phone book that points your domain name to the IP address of Framer's servers.

You'll primarily deal with two types of records:

• A Record: This record maps your main domain (often called the "apex" or "root" domain, represented by @) directly to a specific IP address. Framer requires you to set up two A records for stability and redundancy.
• CNAME Record: This record maps a subdomain (like www) to another domain name. Framer uses this to ensure that www.yourbrand.com also correctly points to your site.

Let's see how this is done in practice.

The article provides the exact values you need to input at your registrar. Here is the configuration for a "naked" or "apex" domain (e.g., yourbrand.com):

Note: These are Framer's current static IP addresses, but you should always confirm them in your project's domain settings at the time of connection.

Now, let's watch the process of someone actually doing this. The following video walks through connecting a domain from GoDaddy, a popular registrar. Even if you choose a different registrar, the concepts are identical.

A Note on Budget and Registrars

Since you're budget-conscious, here are a few things to keep in mind:

• Framer's Offer: If you subscribe to a yearly Framer site plan, they offer a free custom domain for the first year through their partner, Hover. This can be a cost-effective option.
• Registrar Costs: Domain registrars vary in price. While GoDaddy is popular, other registrars like Porkbun or Cloudflare Registrar are often praised for more competitive, transparent pricing without a lot of upsells.

After you update your DNS records, the changes can take anywhere from a few minutes to 48 hours to "propagate" across the global internet, but it's usually quite fast. Framer's interface will show you the status of the connection.

Conclusion

You've now taken the critical step of publishing your work. You have a live site on a Framer subdomain and, more importantly, a clear, systematic understanding of how to connect a professional custom domain when you're ready.

Key Takeaways:

• Publishing to a free Framer subdomain (yourname.framer.website) is an instant, one-click process perfect for initial sharing and testing.
• Connecting a custom domain is a three-step process: buy the domain, add it in Framer, and update your DNS records at your registrar.
• The core of connecting a domain is setting up DNS records: two A records to point your main domain to Framer's IP addresses, and one CNAME record to handle the www version.
• DNS changes can take time to propagate globally, but Framer helps you track the status.

Preview of the Next Lesson:
Your website is live, but how fast is it really? Now that we have a public URL, we can use professional tools to measure its performance under real-world conditions. In our next lesson, we will audit your site's performance using Google Lighthouse and implement recommended optimizations. This will allow us to validate the work we did on images and fonts and ensure your site meets the high-performance standard you're aiming for.