How to add custom translation key in local files in Shopify

Shopify Discussion

Topic summary

A Shopify store owner implemented custom code to display sale percentages on product images, showing “XX% OFF” badges. The implementation worked correctly in English (the default language) but failed to translate properly in Arabic.

Initial Problem:

  • The “OFF” text remained in English on the Arabic version of the site
  • User sought to create custom translation keys in locale files for both languages
  • Standard manual translation options were not available for this custom-coded element

Resolution:

  • Rather than adding new translation keys, the user removed the hardcoded “OFF” text entirely
  • Replaced it with existing translation code from Shopify’s locale system
  • Final result displays the percentage with proper language support in both English and Arabic

The discussion includes screenshots showing both the original implementation and the final working solution. Issue is now resolved.

Summarized with AI on October 30. AI used: claude-sonnet-4-5-20250929.
1

Hello, since couple of days I was trying to show sale with percentage on products pictures. I already did it, and the below picture was my result:

JoIbra_0-1742063401575.png
JoIbra_0-1742063401575.png365×562 95.8 KB

My problem is that, I use 2 languages ( English default and Arabic ) In English language it is ok as you can see in the above picture, But in Arabic also show the same, I want to add custom arabic translation for the word “OFF”, So any body have idea about how can I create translation key in the local files to translate the word off in Arabic language. Here my custom code for showing the % in product pictures

JoIbra_1-1742063726113.png
JoIbra_1-1742063726113.png1167×571 27.5 KB

I do appreciate any help in that

2

Hello, Doxidepro, There is no option for manual translation, as far as i know, it is need to add a new translation key in both English and Arabic local files because the word (OFF) is not defined. I cannot find the correct way to do it.

3

Thank you for you effort,I really appreciate it, I did it by different way, in all cases the percentage displayed and the problem to translate the off word, simply i removed the off word and replace it with original coded translation and working fine.

Here is the result:

JoIbra_0-1742147367200.png
JoIbra_0-1742147367200.png284×465 73.3 KB