An update that has been waited so long for and finally the time has come: Webflow presents its native solution for multilingual websites. But the update around so-called localization (or English: Localization) doesn't stop there.
Why is Webflow localization so important?
Long-time Webflow users certainly know the pain of creating websites for an international audience. Well, the first step would be to add more languages. But it hasn't been that easy for a long time. Either external tools such as Weglot had to be brought in (which quickly became expensive) or all pages were duplicated and packed into a subfolder (e.g. /en/). The problem with this workaround: Changes to the German website had to be followed up 1:1 on the English page. As a result, the workload was doubled.
But relief is finally here. Webflow Localization allows you to add additional languages natively to Webflow and granularly edit the content for all so-called “locales”. For example, it is possible not only to translate texts, but also to exchange images for languages or to manipulate the SEO meta data of your website for other languages.
What can Webflow's Localization do in detail?
If you take a closer look at the new Webflow update, the following features stand out:
- Multilingualism of your website (including automatic translations)
- Customization of the visibility of elements for different locales
- Automatic redirect for visitors to their browser language
- Customization of styles for different languages
- Local meta data such as meta title and description
- Localization of images and alt text for images
- Local styling for static and CMS pages
- Local URLs and subdirectories
- Individual sitemaps for all locales
Attention: Some features may only be available in higher pricing packages. Therefore, check carefully whether the features you want are included in your plan.
1. Multilingualism of your Webflow website
For most websites, this is certainly the core feature: the easy creation of multiple languages in which the website is available to visitors. Webflow also offers the option to have texts automatically translated from one language to another and/or to manually enter them. This opens the door for many internationalization strategies, but is only the beginning of the feature.
Of course, it is not only texts from static pages that can be displayed in several languages. It becomes particularly interesting when large CMS collections (such as blog posts) are available in several languages and the reach of your own content increases massively.
2. Individual visibility and styles of elements
Multilingualism is cool, but Localization only really becomes strong when not only texts, but also graphics/images or entire sections can be adapted specifically to other languages or countries. Webflow offers the option to use tags (similar to when you define the hover state of a button) to define whether images should change. By showing and hiding individually based on the language selected by the user, websites can be individually adapted to conditions in other markets.
An example from the VE team: The individual styling allows, for example, German testimonials for the language German and French testimonials for the language French to be displayed.
3. Automatic language redirect
The native language switcher is practical and 100% stylebable in Webflow. However, the localization of your website can also be configured so that visitors are automatically redirected to the language of their browser. If your website has not defined this language at all, a fallback language (e.g. English) can be used to define where visitors are then redirected. It is of course still possible to switch the language after the automatic redirect.
4. Local meta data (title and description) and alt tags
A great incentive to display your own website in multiple languages is, of course, usability for international users, but also the increasing reach (and SEO improvement) of your own content on the other. This is further reinforced by the fact that even the smallest settings such as SEO meta title and description as well as image alt tags can be adapted for different languages. This significantly improves the visibility and indexing of your locales.
5. Local URLs, subdirectories, and sitemaps
A bit of the cherry on the cake is the adaptability of the URLs for all languages, as well as the creation of individual sitemaps for all created locales. This is how virtual-entity.com/contact → in English becomes virtual-entity.com/en/contact and therefore much easier to understand for international users. By defining subdirectories (as in the example: /en/), it is also possible to determine granularly how the URLs of other languages should be configured.
Thanks to the native integration of hreflang tags, search engines also understand how the individual sub-pages are linked to each other and index your page optimally. Thanks to the automatically created XML sitemap, which is also automatically updated, you no longer have to worry about indexing on Google and Co.
How much does Webflow Localization cost?
Webflow is not stingy when it comes to localization prices. But if you consider the range of functions and look at the alternatives, Webflow Localization is definitely worth a second look. In detail, there are 3 pricing plans that can be paid monthly or annually and are added to your website's hosting fees:
- Essential
- Cost 9$/locale/month
- up to 3 locales can be created
- CMS Localization
- Static page localization
- SEO Localization
- Advanced
- Cost 29$/locale/month
- up to 5 locales
- Automatic translations
- CMS Localization
- Static page localization
- SEO Localization
- Asset Localization
- Custom URLs
- Visitor Redirect
- Enterprise
- Costs must be negotiated with Sales
- also comes with local styles, Element Visibility, full integration with Webflow Enterprise
What surprises us here is that local styles and Element Visibility are only available on the Enterprise plan. In our opinion, Essential and Advanced should also expect further features in the future.
What alternatives do I have to Webflow's native multilingualism?
The pain point that Webflow does not offer (or did not offer) a native solution for multilingualism for their own website was, of course, also identified by other SaaS companies and developed their own solutions for the problem, which can be integrated as a plugin (usually through code embed).
The most well-known alternative is Weglot. The company from France has been offering a powerful translation tool for Webflow for several years and offers some cool features, which we explain in more detail in this article: How to make your Webflow website multilingual with Weglot
In detail, Weglot offers:
- quick and easy setup (< 5 minutes, possible without a developer)
- high scalability due to the selection of over 50 international languages
- Automatic recognition and translations for new languages
- High translation quality, as it is based on AI (e.g. Deepl or Google Translate)
- Individual adjustments to the translated texts
- 1-Click to add more languages
- Adjustments to the texts in the glossary or via the practical visual editor
- Custom URLs for languages
- Automatic redirection of website visitors to their preferred language
- Top customer service and quick help
With Weglot, things only become “problematic” when it comes to individual content for individual languages. Here, you have to work quickly with custom code, which scares off many teams and thus loses potential for localization. Weglot's visual editor is a strong feature, but it remains to be seen whether it can keep up with the native integration of locales in Webflow Designer.
Our take on Webflow Localization and alternatives
Since Webflow Localization was only presented this month and will only be released for non-enterprise customers in the coming weeks, the true use case of Webflow Localization has yet to be seen. However, the features and especially the native and seamless integration into the Webflow Designer make the add-on interesting. By eliminating external tools, page performance should also improve and the vulnerability to errors caused by external code is minimized.