Working with Localization

Webflow Localization is end-to-end solution for customizing your website for visitors around the world – from design to translation to publishing. With these APIs, your Apps can make dynamic content updates and enable custom localization workflows, providing scalability for growing businesses that are looking to enhance global user engagement and optimize performance for international audiences.

Let’s look at an example. AstralFund is an imaginary bank that serves two locales – the United States and France. To properly address each market’s needs, the bank needs to localize content throughout the site. In the images below, we’ve localized some content. In this tutorial, we’ll walk through how to localize the entire site.

What we’ll build

In this tutorial, we’ll walk through the process of localizing content for a French audience on a website. By the end of this tutorial, you’ll have a fully localized “Contact Us” page and a new testimonial that resonates with your French audience. You’ll learn how to:

• Identify primary and secondary locales within Webflow.
• Localize the DOM elements like text and images.
• Optimize SEO data for different locales.
• Manage CMS content across multiple locales.

Prerequisites

Astral Fund Cloneable

Our Localization Example with code samples and localized data

A Webflow site plan that supports CMS

A Webflow App or a Site Token with the following scopes: sites:read, cms:read, and cms:write

Some knowledge of HTTP requests and JavaScript