Icons get translated

Ask the Community General Questions
1

We use an icon library for optional icons used in buttons and inputs, which also get translated. Not sure how, but we would like to avoid those translations as well.

2 Likes
3

Hi there, @user15759 :wave:

Could you please send me a link to the page where your widget is installed? I’ll be happy to check if anything can be done :slightly_smiling_face:

4

https://cc.convertcalculator.com/registration-page-copy/

We added the widget to one of our templates to showcase the translation. This template has various buttons that include an icon. Since the icons are added through a setting on or platform, we have no room to update these with regular svg-icons.

1 Like
5

Thank you!

I am not sure if anything can be done with it, as currently there is no to exclude specific scripts from the translation. You can upvote this request on the Wishlist - Exclude certain texts or scripts from the translation

However, our devs will double-check it and try to find a solution, but I can’t give any promises. I’ll report back once I have their response :slightly_smiling_face:

6

Hi there, @user15759 :wave:

Thank you for waiting!

We’ve managed to stop translating the icons on your page. The text of the icons appears for a second (it’s impossible to change this), but then gets removed. Here is the code we’ve used in the Custom JS section on the Settings tab of your widget’s settings:

const originalIcons = Array.from(document.querySelectorAll('[class*="StyledIconWrapper-sc"]'))
  .map((el) => el.textContent);

function replaceText(numOfCalls) {
  console.log('call' + numOfCalls);
  if (numOfCalls > 15) {
    return;
  }
  const currentElements = document.querySelectorAll('[class*="StyledIconWrapper-sc"]');
  for (let i = 0; i < currentElements.length; ++i) {
    if (currentElements[i].textContent !== originalIcons[i]) {
      numOfCalls = 0;
    }
    currentElements[i].textContent = originalIcons[i];
  }
  
  return setTimeout(() => replaceText(numOfCalls + 1), 300);
}

setTimeout(() => {
  replaceText(0);
}, 300);

Please check your website and let me know if you like the result :slightly_smiling_face: