How to use translated ressource in javascript

CatchAlive
New Member
2 0 0

I am trying to fetch the translated text from a translation supported ressource, and use it in "theme.js" file.

When I look at tutorial https://shopify.dev/tutorials/develop-theme-localization-organize-translation-keys it looks like, it should be possible to write:
var link = '<a href="#">' + layout.navigation.more_html + '</a>';"

But it does not work. In liquid files, this works: {{ 'cart.general.taxes_and_shipping_at_checkout' | t }}

Do I have to "preload" the translated in the theme.strings.xxxxxx ?

Thanks
Martin

Replies 3 (3)
Ognjen_Knaus
Shopify Partner
6 0 1

I usually first define translation separete and then print it:

 

var someVar = '{{ layout.navigation.more_html | t }}'

$( "#checkout_reduction_code" ).after( "<small>" + someVar+ "</small>" );

Get in touch for more help.
beocode.com
Every pixel counts!
Shop2000
Excursionist
43 0 7

This doesnt work for me.

For some reason translations dont work correctly in JS files.

Can anyone from Shopify look into this?

Thanks

 

Shop2000
Excursionist
43 0 7

I guess you have to save the translations in a global variable before you include the js file.