For AI agents: a documentation index is available at the root level at /llms.txt and /llms-full.txt. Append /llms.txt to any URL for a page-level index, or .md for the markdown version of any page.
Dev Portal
DocsAPI ReferenceLearnCommunityChangelog
DocsAPI ReferenceLearnCommunityChangelog
  • Overview
    • Quick Start
    • Sandboxes
    • Tools & SDKs
    • Support
  • Docs
      • Getting Started
        • Overview
            • Localizing Stores
            • Translating Descriptions
            • Translating Page Regions
            • Using Translation Keys
            • Tutorial
            • Storefront Selector
        • B2B Edition for Stencil
    • Archive
    • Closed Beta Programs
Dev Portal
LogoLogo
On this page
  • Adding translations
  • Note
  • Supported language code schemes
  • Resources
DocsStorefrontStencilThemesLocalization

Localizing Variation Descriptions

Was this page helpful?
Previous

Localizing Stores

Next

Translating Page Regions

Built with

Stencil themes support translations for variation descriptions enabling you to customize the display language of your theme.

Adding translations

You can localize theme variations by adding a translations object for each variation in the theme’s config.json file.

The following example demonstrates how to localize each variation description by adding a translations object.

{
 "variations": [
   {
     "name": "Light",
     "id": "light",
     "meta": {
       "desktop_screenshot": "desktop_light.png",
       "mobile_screenshot": "mobile_light.png",
       "description": "This is the light variation for this theme!",
       "demo_url": "https://cornerstone-light-demo.mybigcommerce.com",
       "optimized_for": [
         "multi_purpose",
         "mobile_tablet_desktop",
         "sales_discounts",
         "large_catalog"
       ],
       "industries": [
         "home_garden"
       ],
       "translations": {
         "i18n.description": {
           "default": "This is the light variation for this theme!",
           "en": "This is the light variation for this theme!",
           "zh-CN": "这是这个主题的轻微变化！",
           "fr-FR": "C'est la variation de lumière pour ce thème!"
         }
       }
     },
     "images": {},
     "settings": {}
   },
   {
     "name": "Dark",
     "id": "dark",
     "meta": {
       "desktop_screenshot": "desktop_light.png",
       "mobile_screenshot": "mobile_light.png",
       "description": "This is the dark variation for this theme!",
       "demo_url": "https://cornerstone-light-demo.mybigcommerce.com",
       "optimized_for": [
         "multi_purpose",
         "mobile_tablet_desktop",
         "sales_discounts",
         "large_catalog"
       ],
       "industries": [
         "home_garden"
       ],
       "translations": {
         "i18n.description": {
           "default": "This is the dark variation for this theme!",
           "en": "This is the dark variation for this theme!",
           "zh-CN": "这是这个主题的黑暗变体！",
           "fr-FR": "C'est la variation sombre pour ce thème!"
         }
       }
     },
     "images": {},
     "settings": {}
   }
 ]
}

Note

  • Translations can only contain i18n.description at the moment.
  • You must include the original description value to render the theme on the BigCommerce theme marketplace.
  • Language code must contain a default value.

Supported language code schemes

In addition to the default language code, themes support both ISO 639‑1 and IETF language tag code schemes. The language code must follow a set format of two lowercase letters for a two-letter code system or two lowercase letters, a dash, and at least two alphanumeric characters for a multiple-character code system.

Resources

  • Directory Structure
  • The BigCommerce Theme Marketplace