Next.js localization

There are several methods that you can use to localize content in your Sitefinity CMS application with decoupled Next.js renderer. Depending on your setup, and who manages the localization, you can localize through content modules, this is done manually or via the Translations service, localize through widgets or via the native localization implementation in Next.js. Let's look at each method in more details.

This method allows content editors to localize content directly without the involvement of developers and is the most common method used by content editors.

This type of localization minimizes the customizations of the project and keeps it clean and simple.You do this when you create content and then translate it manually or through the Translations service.

In the manual approach, pages can be created with two different strategies in mind: split or sync. Different translations for the split pages are independent of one another. Sync pages have a common widget structure and can have different widget content per language if needed. You can also override all translated versions with the current one by saving the widget content with the Save all translations option.
For more information, see Languages and Translations.

The Translation service helps automate the process of translating your content items, pages, and templates. With this service, you can easily send multilingual content directly to external translation agencies. For more information, see Translation service.

After the translation, the localized version of the content is displayed on the frontend, depending on the currently selected language of the page. This is handled automatically by built-in widgets, such as Content list or Image widget, and also by custom widgets that use the automatically generated widget designers.

Use this approach when you want to allow localization of specific widgets and their properties. This can be done by exposing the localized resources as properties in the widget designer. This allows non-developers to translate the properties manually through the widget designers.

After translation, the widget resolves the version of the properties for the current language of the page. Except for the Section widget, all other widgets support property localization, and each property can be localized independently. Additionally, when working on a synced page, you can override all translated versions with the current one by saving the widget with the option Save all translations.

By using this approach, you can localize any resource in your widget by using resource files for different cultures. There are two samples that demonstrate this behavior: the SSR sample with a custom implementation and the CSR sample with i18n. For more information, see Next.js native localization sample.