From 778b85653756f8d6386668fad10b28f50c9c5bf8 Mon Sep 17 00:00:00 2001 From: Chris Nowicki <102450568+chris-nowicki@users.noreply.github.com> Date: Thu, 9 Oct 2025 17:02:59 -0400 Subject: [PATCH] =?UTF-8?q?Revert=20"DEVDOCS-6365=20-=20Add=20updates=20to?= =?UTF-8?q?=20multi-language=20being=20turned=20on=20by=20defau=E2=80=A6"?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This reverts commit 39fa8f104d8cad6099d867b3cb5bf2c7a972869e. --- .../multi-language/overview.mdx | 9 +--- .../multi-language/setup.mdx | 49 +++++++++---------- docs/storefront/headless/index.mdx | 28 +++++------ 3 files changed, 36 insertions(+), 50 deletions(-) diff --git a/docs/storefront/catalyst/content-management/internationalization/multi-language/overview.mdx b/docs/storefront/catalyst/content-management/internationalization/multi-language/overview.mdx index 696fff82b..816737b84 100644 --- a/docs/storefront/catalyst/content-management/internationalization/multi-language/overview.mdx +++ b/docs/storefront/catalyst/content-management/internationalization/multi-language/overview.mdx @@ -17,10 +17,6 @@ BigCommerce supports multiple locales for shoppers in different regions. It's possible to modify product URLs in Catalyst so that each variant has a unique URL based on the selected options, essentially creating separate product pages for each variant. However, this isn't done automatically and requires custom code. You can link to a specific product variant using query parameters, which update dynamically as options are selected on the product detail page (PDP). * Add translations for categories and locations to multiple locales added to Catalyst channel. Learn about how to use the [GraphQL Admin API](https://developer.bigcommerce.com/docs/store-operations/translations) to add translations to a single channel and locale. - - Managing locales (in Control Panel, CLI, or via the GraphQL Admin API) is available for Catalyst channels. As of `October 2025`, all Catalyst stores have the multi-language feature enabled by default. On stores where multi-language is disabled, locale mutations and Channel Manager locale controls aren't available. - - ## Default Catalyst features ### Manage language settings @@ -37,8 +33,6 @@ Out of the box, the Catalyst storefront displays translated product data for the The Catalyst storefront sends an `Accept-Language` HTTP request header to indicate the shopper’s preferred language or locale. This header allows the system to identify the appropriate translation to display. The translations for checkout are dynamically applied based on the locale specified in this header. -Catalyst always respects the shopper's `Accept-Language` header and the storefront language selector; there is no Control Panel toggle for “use browser language” on Catalyst channels. - ## Customization Catalyst provides built-in features, but you can further customize its functionality to fit your needs. @@ -51,7 +45,7 @@ You can manage language settings within a channel using the GraphQL Admin API or * Setting a default language * Activating or deactivating specific languages -By default, a new Catalyst project starts with a single locale. Add and manage additional locales using the GraphQL Admin API or the CLI. For detailed instructions, refer to the [Locale Configuration Guide](https://developer.bigcommerce.com/docs/store-operations/settings/locales). +By default, Catalyst does not include multilingual support when installing a storefront via the CLI. However, you can enable and manage locales using the GraphQL Admin API or the CLI. For detailed instructions, refer to the [Locale Configuration Guide](https://developer.bigcommerce.com/docs/store-operations/settings/locales). ### Configuring language settings using the CLI @@ -97,3 +91,4 @@ By default, BigCommerce offers translations for the checkout page and emails in ## Resources * [Locale Configuration](/docs/store-operations/settings/locales) + diff --git a/docs/storefront/catalyst/content-management/internationalization/multi-language/setup.mdx b/docs/storefront/catalyst/content-management/internationalization/multi-language/setup.mdx index f0a88df0d..04114d5eb 100644 --- a/docs/storefront/catalyst/content-management/internationalization/multi-language/setup.mdx +++ b/docs/storefront/catalyst/content-management/internationalization/multi-language/setup.mdx @@ -12,12 +12,7 @@ Follow the [Getting Started with Catalyst](/docs/storefront/catalyst/getting-sta ## Adding a locale in Catalyst - - **Control Panel access:** The Localization tab in Channel Manager for adding/removing locales is available for Catalyst channels in **Settings** > **Localization** or via editing the channel in **Channel Manager**. - **Default:** multi-language is enabled by default on all Catalyst stores. - - -You can add additional languages to your storefront when you initially create your Catalyst storefront through the Control Panel. If you didn't do so, you have a couple of options. +You can add additional languages to your storefront when you initially create your Catalyst storefront through the Control Panel. If you didn’t do so, you have a couple of options. You can enable more locales for your storefront through the Control Panel: @@ -39,17 +34,17 @@ Go ahead and start your development server. When you visit the running applicati The selector lists all the enabled locales in your storefront. The storefront in this tutorial uses English as the default language and French (`fr`) as an additional language. -You might have to restart your development server to see the new locale in your storefront selector. +You might have to restart your development server to see the new locale in your storefront selector. ## Locale-specific URLs -Now, try switching to your newly added locale, in my case `fr`, in the storefront selector. Notice the locale prefix, e.g. `fr`, has been applied to the pathname in the URL, `http://localhost:3000/fr`. This is because Catalyst uses [prefix-based routing](https://next-intl.dev/docs/routing/middleware#locale-detection) from the [`next-intl`](https://next-intl.dev/) library which means the locale prefix will be added to the pathname of each localized page. +Now, try switching to your newly-added locale, in my case `FR`, in the storefront selector. Notice the locale prefix, e.g. `fr`, has been applied to the pathname in the URL, `http://localhost:3000/fr`. This is because Catalyst uses [prefix-based routing](https://next-intl.dev/docs/routing/middleware#locale-detection) from the [`next-intl`](https://next-intl.dev/) library which means the locale prefix will be added to the pathname of each localized page. ## Translating static strings The Catalyst source code includes text elements that can be translated using predefined static strings. These static translations are housed in the `core/messages` folder in your Catalyst app. You can then access the static translations within your components using the `next-intl` library. -Let’s explore more of how this works! Static string translations are already provided for the locales that Catalyst supports out of the box, like `fr`, so let’s start there. +Let’s explore more of how this works! Static string translations are already provided for the locales that Catalyst supports out of the box, like `FR`, so let’s start there. 1. In the `core/messages` folder, open the pre-populated translation file for French, `fr.json`. You should see predefined translation keys — for example, those used in an empty cart message — along with their translations. @@ -73,7 +68,7 @@ Let’s explore more of how this works! Static string translations are already p // load all the translation strings from core/messages under the 'Cart' namespace. const t = await getTranslations('Cart'); - + // pass translated strings into your components const emptyState = ( <> @@ -89,13 +84,13 @@ Let’s explore more of how this works! Static string translations are already p } ``` -3. If you click on the cart, you should see a translated empty cart message if you switch your locale to `FR`. +3. If you click on the cart, you should see a translated empty cart message if you switch your locale to `FR`.