Framer tutorials

How to set up a Framer site end-to-end

Framer feels like Figma until you hit publish — then it suddenly behaves like a real CMS. This walks the path from empty project to a live custom domain, including the breakpoint and domain-connect steps that trip up most first-time builders.

How to set up a Framer CMS collection

The Framer CMS is fast once you understand it — but the canvas-first UX hides decisions that matter: slug strategy, reference fields, dynamic SEO meta. This walks the full setup for a blog (and the same pattern works for case studies, team, jobs).

How to set up SEO meta tags on a Framer site

Framer ships clean HTML and fast Core Web Vitals — but it does not auto-generate good SEO meta. Every page needs deliberate title, description, OG, and (for CMS) dynamic bindings. This is the full setup specialists run on every Framer site.

How to set up Framer forms with email, CRM, and Slack integrations

Framer's native form is easy to design and easy to misconfigure. Most DIY setups capture leads to the Framer CMS and never route them to email, CRM, or Slack — so leads pile up in a dashboard nobody checks. This walks the full integration path.

How to install Google Analytics 4 on a Framer site

Framer doesn't have a native GA4 field — every install goes through Custom Code. Half of DIY Framer GA4 installs end up double-counting from the .framer.app staging subdomain or missing form-submit events entirely. This walks the full install.

How to fix Framer site speed and Core Web Vitals

Framer ships fast HTML out of the box. Then a marketing team adds images, animations, fonts, and pixels — and the mobile PageSpeed score collapses. This is the diagnostic sequence specialists run when a Framer site loses speed.

How to set up Framer animations without killing your site speed

Framer is famous for animations — and just as famous for the sites that go from 90 PageSpeed score to 30 after a marketing team gets enthusiastic with motion. This walks the animation patterns that look great AND keep your site fast.

How to set up Framer custom code components

Framer's killer feature for power users: write real React, paste it in, and use it like any native component. But this is also where most Framer sites turn into maintenance nightmares. This walks the right way to set up code components.

Framer vs Webflow vs WordPress — which is right for your marketing site?

There is no single 'best' platform — there are three platforms with different strengths and different costs. This breaks down when each one is the right call, in plain language.

When to hire a Framer specialist — an honest checklist

Framer is gorgeous and accessible — until you hit the wall where every change costs you a day. This is the honest framework: when the time cost of DIY exceeds the cost of hiring, and how to tell which side you're on.

Webflow

Design-led website builder; the default for marketing sites at funded startups and design-forward brands.

10 tutorials

Squarespace

All-in-one website builder — popular for portfolios, small businesses, and creators wanting design polish.

10 tutorials