Skip to content
Adobe Commerce Storefront

Search is only available in production builds. Try building and previewing the site to test it out locally.

Multistore

Localization

This guide will walk you through the process of localizing the content of your storefront using Document Authoring (da.live).

Prerequisites

  • You have a storefront project in the Document Authoring app ( da.live ) of the Storefront Builder.
  • You know the basics of using the Document Authoring tool as described in the documentation here: ( da.live/docs ).

Additional resources

Big picture

The following diagram provides the basic workflow for translating the Edge Delivery content of your storefront into multiple languages using the Document Authoring apps da.live .

Workflow for localizing your storefront

Workflow for localizing your storefront

Step-by-step

These steps provide the details for the translation workflow shown in the diagram. The steps describe how to translate the default English store to another language. In this example, we will translate the default English store to French (fr).

Navigate to your storefront’s apps page

  1. Open your storefront project in the Document Authoring tool ( da.live ).
  2. Select Apps from the left sidebar.

Use the Traverse app to get a list of site URLs

  1. Open the Traverse app by selecting its Go button.
  2. On the Crawl Tree page, enter your storefront’s organization name and site name. Example: /acme/storefront. Ensure that you enter a forward slash (/) at the beginning of the string or it will not work.
  3. Select the Crawl button to start the crawl.
  4. Select the Copy list button after the site’s URLs have been traversed. This puts all the URLs in your clipboard.
  5. Return to the Apps page.

Use the Translation app to translate your storefront

  1. Open the Translate app by selecting its Go button.
  2. On the Localization page, enter the Title of the translation project: acme-storefront-fr.
  3. Paste the list of URLs from the Traverse app into the URLs field.
  4. Select the Next button.
  5. View the validated URLs to ensure that they are all correct.
  6. Select the Next button.
  7. Select one or more languages you want to translate to. In this example, we will translate to French (fr).
  8. For the French language, select Translate from the selector, then select the Create project button.
  9. From the project page, select the Send all for translation button.

View the translated site

  1. Navigate back to the main (root) folder for you English storefront.
  2. Scroll the site files and folders to find the fr folder and open it.
  3. Select a document to view the translated content. For example, select the index document to view the translated home page.