How to Add Custom Text Translations Using the Visual Editor
This guide can help you to use custom translation when text is not directly accessible through the visual editor.
On my store's Homepage, there are plenty of different elements with text in them.
When switching to French we can see most of the text has been translated, but there is a section of text that isn't, and I am unable to translate this text with the Visual Editor.
To resolve the issue, we would need to use the Custom Translation feature of the Visual editor:
- First, let's copy the text from the element we want to translate
- Then lets scroll up in the Visual Editor and click on "Custom translation"
- Click on the "New Custom Translation" Button
- Here we can paste the text that we want to translate but also notice that the text has extra attributes associated with it, so we can click "Code View" to clean up the text if we need to.
- There is lots of extra HTML code with the base text, so let's get rid of everything that isn't the base text
There we go, all cleaned up.
- In the translation text box, let's go ahead and put in the translated text, and create the translation
- Our Translations are set up! We can create a new one or view our translation on our shop
There we go! Our custom text is now translated!
Need to know more about the Visual Editor? Check out this helpful guide.
If you have any further questions or concerns, please feel free to reach out to us at help@hextom.com