translateString

translateString injects variables into a translated string. Shopify translations often contain placeholders (e.g. {{ count }} or %{count}) that need to be swapped out for real values at runtime — this function handles that replacement for you.

It accepts:

Argument	Type	Description
translation	string	The translated string containing placeholders.
variables	Object	A key/value map. Each key matches a placeholder name; the value is substituted in.
options	Object	Optional. Overrides the delimiter patterns. Defaults to supporting both {{ }} and %{ }.

Usage examples

Basic

2.0 Build

window.BAO.utils.translateString('Hurry! Only {{ count }} left in stock.', {
  count: 2,
})
// 'Hurry! Only 2 left in stock.'

1.0 Build

translateString('Hurry! Only {{ count }} left in stock.', {
  count: 2,
})
// 'Hurry! Only 2 left in stock.'

Multiple variables

2.0 Build

const string = window.theme.strings.cartCount // 'You have {{ count }} items from {{ shop }}'

window.BAO.utils.translateString(string, {
  count: 3,
  shop: 'BAO',
})
// 'You have 3 items from BAO'

1.0 Build

const string = window.theme.strings.cartCount // 'You have {{ count }} items from {{ shop }}'

translateString(string, {
  count: 3,
  shop: 'BAO',
})
// 'You have 3 items from BAO'