How to make product name localizable


Developers ask us to find the easiest way to localize product name.

You can select multiple languages for the catalog. But if you open the product blade, you see one value for the product name. It’s the System Product Name. You can make product name localizable by adding a new property DisplayName and use this property in StoreFront.

Step 1. Create Display Name property

  1. Open Catalog Settings
  2. Add a new Product Property: Display Name
  3. Save property

Step 2. Populate Display Name property

Use Import or Manually Enter the value to populate Display Name property for the products.

Step 3. Change the liquid template

Change the liquid template to display localized value from Display Name property.

{{['DisplayName'] }}


You can add additional logic to check if Display Name value is empty, then display System Name.

You shouldn’t be using arrays in liquid view so instead of

{{['DisplayName'] }}


{{ }}

1 Like