How to Use a Framer Template After Buying It: The Complete Step-by-Step Guide

You've found a Framer template you love, clicked the purchase button, and now you're staring at a confirmation email wondering what happens next.

The good news: it's genuinely fast. Most people go from "just purchased" to a live, personalized website in a single afternoon. But if you've never used Framer before, the process isn't completely obvious — especially the remix link step, which confuses almost everyone the first time.

This guide walks you through every step in order: from getting the template into your workspace, to customizing it with your own content, to publishing it live with your own domain. Every step is sourced from Framer's official documentation and practitioner guides, so you're not working from outdated tutorials.

Step 1 — Get the Template Into Your Workspace

The way Framer templates are delivered is different from what most people expect. There's no file to download and no import button to find. Instead, everything works through a remix link.

If you bought a free template from the Framer Marketplace

According to Framer's official help documentation, the process for free templates is:

1. Visit the Framer Marketplace

2. Find the template you want and click "Use for Free"

3. A Remix window will appear showing the template name and a preview

4. Click "Copy" to duplicate the template into your account

5. The project opens directly in Framer — choose a workspace if prompted

That's it. No payment, no email. The template is immediately in your dashboard as an editable project.

If you bought a paid template from the Framer Marketplace

Paid templates on the official Marketplace go through the creator's own checkout system. According to Framer's official guide on using templates:

1. Click "Purchase for…" on the template's Marketplace page

2. You'll be redirected to the creator's checkout page (often Gumroad, Lemon Squeezy, or a custom page)

3. Complete the payment

4. Check your email — you'll receive a message from the creator containing your remix link

5. Click the remix link in that email

6. A Remix window opens showing the template — click "Copy" to add it to your workspace

Important: Framer does not handle payments or refunds for templates. All transactions go through the individual creator's checkout system. If you don't receive your remix link within a few minutes of purchase, check your spam folder first, then contact the creator directly. Their support email is listed on the template's Marketplace page.

If you bought from a third-party marketplace (Gumroad, own website, etc.)

Many Framer template creators sell outside the official Marketplace — through their own website, Gumroad stores, or other platforms. The delivery method is the same: you'll receive a remix link by email. The process from there is identical to the paid Marketplace flow above.

Step 2 — Understanding the Remix Link

Before you start customizing, it's worth understanding what a remix actually does — because the word "remix" is specific to Framer and doesn't mean what it sounds like.

When you click a remix link, Framer creates a fully independent copy of the template in your own account. The original template is not modified. You don't share a project with the creator. You're not editing "their" file. You get your own complete, editable duplicate — which you can customize, publish, and update however you like, independently.

Remixing is essentially like duplicating a project. Once it's in your workspace, you can modify everything: text, images, layout, colors, animations, CMS content, and pages. No coding required for any of it.

One practical note: if the template doesn't appear in your dashboard immediately after clicking the remix link, Framer's help docs suggest two fixes — refresh your dashboard, or re-click the link. This is especially common if you just created a new Framer account or if you're using a different browser than usual.

Step 3 — Orient Yourself in the Editor Before Touching Anything

Once the template opens in Framer, resist the urge to immediately start changing things. Spending five minutes understanding the structure first will save you a lot of confusion later.

Here's what to look at:

The left panel — Pages and Layers. This shows you every page in the template, and within each page, every layer and section. Scan through the pages to understand what's included — most templates have a homepage, a few inner pages, and sometimes a blog or CMS section.

The Assets panel — where global styles live. This is the most important panel for customization, and it's where most beginners miss a crucial shortcut. Click the Assets tab (top of the left panel) and look for the Styles section. Well-built templates define all their colors and typography here as global variables. If a template uses global styles, you can change the entire site's brand color in one click — rather than hunting through every element on every page. According to Framer's own post-purchase guide, checking for global color and text styles in the Assets panel before editing is one of the first things you should do.

Components. Templates use components — reusable building blocks like headers, footers, cards, and navigation bars — that appear on multiple pages. If you edit a component, the change applies everywhere that component is used. This is a powerful time-saver, but it means you need to be intentional: editing a button inside a component changes every instance of that button across the entire site.

Step 4 — The Right Order to Customize

The order in which you make changes matters. Here's the sequence that experienced Framer users follow to avoid rework:

4a. Update global styles first

Before touching any individual text or image, open the Assets panel and update the color and typography styles to match your brand.

For colors: go to Assets → Styles → Color. Each entry is a color variable used throughout the template. Click a swatch, change the hex code, and every element using that color updates instantly across all pages.

For typography: look for the Typography section in the same panel. Most well-built templates define two to three font styles — a heading font, a body font, and sometimes a display or accent font. Update these first, and the fonts update everywhere.

Critical tip from practitioners: Always update existing styles — don't create new ones. New style variables won't automatically apply to existing elements. If you create a new color and assign it manually to individual elements, you lose the global update benefit entirely.

4b. Edit the global header and footer

The header and footer are global components in most Framer templates — meaning they appear on every page. Edit them once and they update everywhere.

To edit the header: either click it directly on the canvas and look for "Edit Component" in the properties panel, or go to Assets → Templates → find the Header component and double-click it.

Update your logo (either swap the image or edit the text if it's text-based), update your navigation links to match your actual pages, and adjust any CTA buttons to point to the right destination.

4c. Replace placeholder content page by page

With global styles and components updated, work through the pages and replace placeholder content with your own.

Editing text: Double-click any text layer on the canvas to enter edit mode. Replace the placeholder text with your own. Use the Properties panel on the right to adjust font size, alignment, weight, and color if needed — though if global styles are set up correctly, you often won't need to.

Replacing images: Double-click any image on the canvas to access the image replacement option. You can drag and drop a new image file directly onto the canvas, or paste an image URL. Framer hosts images on its own CDN automatically — you don't need a separate image hosting service.

Deleting pages you don't need: If the template includes pages you won't use, hover over the page name in the left panel, click the three-dot menu that appears, and select Delete. Note that Framer doesn't have a "hide page" option — if you want to keep a page but not publish it, you'll need to either duplicate the project before deleting, or toggle the page's indexing off in page settings.

4d. Update the CMS (if the template has a blog or dynamic content)

If your template includes a blog, case studies, team members, or any other CMS-driven section, you'll need to add your actual content to the CMS collections.

Click the CMS icon in the left panel (or go to the Canvas panel → Collections). You'll see the template's demo content — blog posts, project entries, team bios, etc. — already set up with placeholder data.

Click into any collection and add your own entries, or edit the existing ones to replace placeholder titles, descriptions, dates, and images with your real content.

Step 5 — Fill In Your SEO Settings

This step is often skipped and it matters. Before you publish, fill in the meta information for every page.

For each page:

1. Click on the page in the left panel to select it

2. In the right-hand Properties panel, look for the SEO section

3. Add a meta title (under 60 characters) and meta description (under 160 characters) specific to that page

For CMS-driven pages (blog posts, etc.), set up dynamic SEO variables in the page template rather than filling them in per post. In the CMS page template, open the SEO panel and bind the title field to {{Title}} and the description to {{Description}} — Framer will auto-populate unique SEO data for every CMS entry automatically.

Also add alt text to your images as you replace them. Double-click an image and look for the alt text field in the properties panel.

Step 6 — Preview Before Publishing

Before going live, use Framer's preview to check how your site looks and behaves.

Click the Preview button (the play icon in the top right of the editor). This opens a live, interactive version of your site in a new tab — the same experience your visitors will have.

Check:

• Every page loads and looks correct

• Navigation links go to the right pages

• Forms are set up with the right destination email or integration

• Content looks correct on mobile (click the mobile icon in the preview to switch viewport)

• Animations feel intentional and don't make the page feel sluggish

Step 7 — Publish Your Site

When you're ready to go live, click the Publish button in the top-right corner of the editor.

Publishing to a free Framer subdomain

By default, Framer publishes your site to a free subdomain in the format yourproject.framer.website. This works fine for testing, but it's not suitable for a real business website — it looks unprofessional and search engines treat it as a lower-authority signal than an owned domain.

Publishing to a custom domain

To publish with your own domain (e.g., yourbrand.com), you need a paid Framer plan (Basic starts at $10/month) and a domain registered with a domain registrar.

Option A — Claim a free domain through Framer (simplest)

As of 2026, all paid annual Framer plans include a free .com domain registration for the first year. To use this, go to your project's Site Settings, navigate to the Domains section, and click "Claim a free custom domain". Search for your desired domain — if it's available, Framer registers it and connects it automatically. No manual DNS setup required.

Option B — Connect a domain you already own

According to Framer's official domain guide:

1. Go to Site Settings → Domains → "Connect a domain you own"

2. Enter your domain (e.g., yourbrand.com)

3. Framer will display the DNS records you need to add — typically two A records and one CNAME for the www redirect

4. Log into your domain registrar (GoDaddy, Namecheap, Cloudflare, etc.) and add those DNS records in their DNS management panel

5. Return to Framer — once DNS propagates, your domain is connected

DNS propagation typically takes a few minutes to a few hours, though Framer's docs note it can take up to 48 hours in some cases. Framer handles SSL (the https:// padlock) automatically once the domain is connected — you don't need to configure that manually.

If you use Cloudflare: Make sure your domain's proxy setting is set to "DNS only" (grey cloud, not orange). Framer does not support Cloudflare proxy mode. Also note that Framer does not support IPv6 — do not add AAAA records.

Once your domain is connected, click "Set as Default" in Framer's Domains settings to make it the primary URL for your site.

Step 8 — Keep It Updated

Publishing is the beginning, not the end. Framer makes ongoing updates straightforward.

Whenever you make changes in the editor — updating content, adding a blog post, tweaking a section — those changes are not live until you publish again. Click the "Update" button (which replaces the Publish button after your first publish) to push changes live.

If your template has a blog CMS, you can add new posts directly from the CMS panel without touching the design at all — useful for non-designers managing their own content after launch.

Common Problems and How to Fix Them

"I don't see the template in my dashboard after clicking the remix link." Refresh the page. If that doesn't work, click the remix link again — this is particularly common if you just created a new Framer account or switched browsers mid-process.

"I changed a color but it only updated on one element, not the whole site." You edited the element's color directly instead of editing the global style variable. Go to Assets → Styles → Color, find the color you want to change, and update it there. If the element isn't connected to a global style, you'll need to manually reassign it to the right style variable.

"My domain isn't connecting after 24 hours." Check that you added the DNS records exactly as Framer provided them, with no extra A records or conflicting entries. Use a DNS checker tool to verify what's propagating. If you use Cloudflare, make sure the proxy is off (grey cloud). Contact your domain registrar's support if records look correct but still aren't resolving.

"I need a refund on my template." Contact the template creator directly — their support email is listed on the template's Marketplace page. Framer itself doesn't process refunds for template purchases, as all transactions are handled by the creator.

"I deleted a page by accident." Framer doesn't have an undo for page deletion in all versions. If you have a backup or the template's remix link, you can re-remix the original template, open that copy, and copy-paste the page back into your working project.

Frequently Asked Questions

Do I need a Framer account to use a template? Yes. You'll need at least a free Framer account to receive and use a remix link. The free account lets you design and edit; a paid plan (from $10/month) is required to publish with a custom domain.

Can I use the same remix link multiple times? Most creators generate a single-use or limited-use remix link per purchase. If you need a fresh copy — for example, to start over — contact the creator and they can provide a new link.

Can I give the template to a client? You can design the site and transfer the project to a client's Framer account. However, you cannot resell or redistribute the remix link itself — Framer template licenses are for the buyer's own use only.

What if I don't have a paid Framer plan yet? You can remix and fully customize the template on the free plan. You only need to upgrade when you're ready to publish with a custom domain. The free plan publishes to a framer.website subdomain at no cost.

The template looks different from the demo. Why? Template demos show the design with high-quality placeholder images and polished copy. When you remix it, you get the structure with placeholder content — your images and text replace the demo content. The design itself should look identical if you haven't changed any styles yet.