Internationalization

You can localize your Catalyst storefront so that it appears in the shopper's preferred culture or language throughout their browsing and checkout experience.

Note

Internationalization support in Catalyst is a work in progress. Full multilingual support in headless channels, like Catalyst, will be added in future releases.

Use cases

Catalyst supports the following scenarios:

  1. Multi-Storefront setup for multiple regions: You are selling internationally to multiple countries, where each country has its own language, currency, payment method, etc. This requires a multi-storefront setup.

    In a multi-storefront setup for international selling, the backend allows you to create separate Catalyst storefronts for each market. You can customize various elements for each storefront, such as payments, shipping, promotions, and catalogs for each storefront. On the frontend, these storefronts can be presented as locale-specific URLs for shoppers.

    This approach is particularly common if you want unique shopping experiences for different countries like France and Germany. While each storefront is customized for its target audience, merchants often interlink the sites, enabling shoppers to choose their preferred country's website for purchases.

    For how to implement this use case, see the Catalyst Multi-Storefront Guide (opens in a new tab).


  2. Single storefront setup for multi-language: You are selling within a country and would like to accommodate multiple languages within that country.

    Catalyst supports translating content into multiple languages on a single storefront. You can provide translations of product descriptions, categories, navigation menus, customer service pages, and other storefront content to cater to customers speaking different languages.

    With a single storefront setup, the shopper's experience remains consistent, but the content is displayed in their preferred language. This use case is particularly common in multilingual countries like Canada, where the same storefront serves shoppers in two primary languages without altering the overall user experience.

    For how to implement this use case, see the Catalyst Multi-Language Guide (opens in a new tab).

    Catalyst also allows you to combine both approaches. For example, you can create multiple storefronts for regions like France, the UK, and Belgium, while further customizing the Belgian storefront to support three languages within a single store.

In both cases, to fully localize a store for a language or region, you will need to customize both dynamic product catalog data and the static theme content:

  • Dynamic product data: product-related content that is generated or retrieved from the backend, such as product names, descriptions, images, and more.
  • Static theme content: fixed text elements within the storefront's shopper interface—such as buttons, labels, carousel text —that need to be translated into multiple languages. These predefined static strings ensure a consistent localized experience across all pages.

Deployment

Here are your options for deploying Catalyst storefronts depending on your use case:

  • If you have a single storefront setup for multi-language, deploy your storefront under one project.
  • If you have a multi-storefront setup routed using subpaths, map your locales to the storefront channels in your project’s channels.config.ts (opens in a new tab) file. This applies regardless of whether you have multiple languages on each storefront.
  • If you have a multi-storefront setup routed with multiple domains, you can either
    • Deploy multiple projects
    • Add multi-domain routing into Catalyst