Framer Localization Setup: Locales, Slugs and hreflang Step by Step

How do you set up Framer localization?

You set up Framer localization in five passes: plan URLs and slugs, add locales, translate strings, translate page paths and CMS slugs, then publish and verify hreflang. The order matters because slugs and fallbacks are hard to change once pages are indexed in several languages.

This is the hands-on setup. If you're still choosing a platform, our Webflow Localization vs Framer Localization comparison weighs cost per locale, and our multilingual website guide covers which markets to launch first.

Settings below reflect Framer's help center as of 2026; check the current help article before you rely on one.

What should you plan before adding locales in Framer?

Plan three things before you click anything: which locales you need, what each page's path will be in each language, and what happens when a translation is missing. Framer makes all three easy to set and tedious to unwind.

• Locales and regions. Framer lets each locale target a language and, optionally, a region. Only add a regional variant such as Spanish for Mexico when the copy, pricing or proof actually differs from your general Spanish version.
• A slug sheet. One row per page and CMS collection, one column per locale, with the exact path you want. A pricing page might be /pricing, /de/preise and /fr/tarifs.
• Fallback rules. Framer shows a fallback language when a string, image or page hasn't been translated. Decide whether a half-translated page should go live at all.
• Locale-only pages. If a page should exist only in one market, note it now. Framer can hide pages in a locale, with limits covered below.

Framer serves locales as path prefixes, such as /de or /pt, with the default locale at the root. That's the subdirectory structure most multilingual sites should use; our guide to subdirectory vs subdomain vs ccTLD explains why it keeps authority on one domain.

How do you add locales and translate content in Framer?

Add locales from the Localization view, then translate in the table or on the canvas. Each locale covers one language, and once it exists, its strings, including page titles, descriptions and image alt text, appear in the table grouped by page.

1. 1

   Open the Localization view

   Open it from the menu in the top-left corner of the Framer editor. This is where locales, translations and localization settings live.

2. 2

   Add a locale

   Click Add Locale and pick the language. Add a region only if you need a regional variant, and set a fallback language so missing strings show something readable rather than nothing.

3. 3

   Translate strings in the table

   Work page by page using the filters. Type translations, paste them from your translator, or run AI Translation on some or all content as a first draft. Images can be swapped per locale too, which matters for screenshots with text in them.

4. 4

   Edit in context on the canvas

   Switch locales from the locale icon in the canvas's bottom bar and fix strings in place. This is where you catch German headlines that wrap to three lines or buttons that no longer fit.

5. 5

   Review titles and descriptions per locale

   Page titles and meta descriptions are strings like any other. Rewrite them for each market's search terms instead of accepting a literal translation.

6. 6

   Add a locale switcher

   Put a language switcher in the nav and footer so visitors can override any automatic choice. Our guide to language switcher UX covers labels, placement and why flags are the wrong signal.

Treat AI Translation as a draft. Machine output gets the words roughly right and the persuasion wrong, the gap our article on localization vs translation covers. Have a fluent reviewer edit headlines, CTAs and pricing copy.

How do translated slugs and localized page paths work in Framer?

Translated slugs in Framer come from the Translate Page Paths setting, which gives each locale its own path for the same underlying page. Turn it on in the Localization view's Settings; Framer's help center says it's on by default if you already translate CMS slugs such as blog posts.

Once it's on, translated paths appear under each page header in the Localization view, and you can edit them there. On the canvas, pick a locale in the Page panel, right-click a page and choose the rename option for that language. Framer can also AI-translate paths, but enter them from your slug sheet instead: a path is a URL you'll live with, not copy to polish later. Framer's localized page paths article shows the current screens.

Framer flags any translated path that conflicts with another route in any locale. Fix every conflict before publishing, then use the switcher on the live site to confirm each URL changes.

How do you check hreflang on a Framer site?

Framer generates hreflang tags and the html lang attribute automatically, and you can't edit either in the UI. So you don't write hreflang in Framer; you verify it, on staging and again after the custom domain is live.

1. Open one page per template in each locale and do a full reload before viewing the source.
2. Check that every locale version is listed, including a self-reference, and that the URLs use your translated paths.
3. Confirm the lang attribute matches the locale you're viewing.
4. Crawl the site with an SEO crawler that reports hreflang, and look for alternates that point to redirects or 404s.
5. Check that hidden, locale-only pages don't appear as alternates in locales where they 404.

The reload in step one matters. Framer's help center explains that its sites navigate like a single-page app, so hreflang tags in the source don't re-render when you switch language through internal links. A stale tag after clicking the switcher is expected, not a bug. For the rules behind a correct set, including x-default and return tags, read our hreflang guide.

Should you turn on Automatic Locale in Framer?

Turn on Automatic Locale if most visitors land on your default-language homepage and many of them prefer another language. It sends visitors to a matching locale based on their browser's language list, not their location, and Framer's docs say search engine bots are never redirected.

For routing by country rather than language, Framer points you to a Firewall redirect-to-locale rule. Use it for legal or pricing differences, not language preference.

How do you handle locale-only pages and redirects in Framer?

Hide a page in a locale by right-clicking it in the Localization view and choosing to hide it there; visitors who open that URL get a 404, and the locale picker drops that language for the page. Framer's help center notes two limits: you can't hide items in the base locale, and as of November 2025 you can hide pages only in newly added locales.

Redirects need more care on a localized site. Framer's docs say redirect targets understand localization but sources are matched as plain strings, so a pattern must list every locale you want to catch. The Expand to all locales option writes a fixed pattern when you save, so if you add a locale later, update the rule and republish. Keep a redirect sheet next to your slug sheet; it's the document you'll want if you ever rebuild the site, which is the scenario our Framer to Next.js migration cost guide prices out.

Two last checks. For Arabic or Hebrew, Framer has a Reverse layout setting under the site's layout direction; our multilingual web design guide covers what mirroring changes. And run the checks in our Framer AEO guide on each locale, not just English. To hand the build over, see our Framer development service.