Website in many languages... How would you go for it?

Wappler General
1

Hey guys,

If a website is needed to be in many languages (let's say 20+ languages) how would you go about it?

Just to clarify:

  • both static captions and dynamic content has to be translated
  • the translation has to be accurate
  • payed solutions are acceptable

I'm not asking for a detailed approach or explanation but just a general path/way of doing it.

1 Like
2

I’ve used Google site translate in the past. It’s very accurate and copes well with dynamic content.

1 Like
3

Even better translation is done by ChatGPT these days. And the advance is you can just give him a json file with all the texts and request it back in different language :slight_smile:

5 Likes
4

I made a test in the past using:

  1. Browser component
  2. Json files
  3. Data view

So the data view load the json as: {{browser1.language}}.json that turns into: es.json/en.json
And all static content are loaded from the data view component.
As I remember, all was pretty good.

For dynamic data, that's another thing, maybe you can tell us more about how it'll be stored

2 Likes
5

Following.

We use i18n but not that easy to work with yet + need to look at dynamic data in the coming weeks.

For example error notifications... Current plan (haven't built a POC yet) is to return a key like error_validation and then use i18n to transltae that to different languages.

Same with success notifications: success_updated: "You've saved your settings!".

If this does work, then there's one more caveat which would be nice to fix (input welcome!):
I like my feedback to users to be as specific as possible.

In example, user saves a form that inserts a 'lecture'. Then I'd like to show
success_inserted: "You've created a new lecture"

But then I'd have to pass eomthing like
success_inserted_lecture

Which would cause the translation file to be quite a lot bigger.

1 Like
6

I typically use the google translate. It's very easy. Add this to your head on each page you want translated:

<script type="text/javascript">
    // <![CDATA[
    function googleTranslateElementInit() {
    new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element');
    }
    // ]]>
</script>
2 Likes
9

Then add this class in a div tag wherever you want on your page - I usually put it at the top right. It appears as a button.
class="col-12" id="google_translate_element" align="right"

1 Like
10

We've recommended/implemented Weglot to a few enterprise grade customers (non-Wappler) https://www.weglot.com/homepage

1 Like
11

Used that widget many times, works really well

1 Like
12

using:

  <script type="text/javascript">
    function googleTranslateElementInit() {
                new google.translate.TranslateElement({pageLanguage: 'en'}, 'google_translate_element');
              }
  </script>

Gives a full dropdown of all valid languages so you can switch between them easily with instant translation

1 Like
13

Thank you all guys!!
@TMR , @George , @franse , @karh , @jpena , @umadmin , @Hyperbytes

@franse thanks buddy, very nice suggestion!
I think I have read about it but haven't paid attention.
*I apologize... I don't think that dynamic content will need translation!

@kath haven't used it (I have just read about it from @JonL but wasn't intrested about it and didn't pay attention)
But I really believe that I prefer something paid and taken care for well so I can spend time on more important things. Thank a lot anyway mate!

@umadmin I think this a good one... I'll explore it in detail when the time comes. Thanks my friend!!

@TMR @jpena @Hyperbytes are you guys talking about the same thing?
I will give it a try to see
But I really want the rendered content to be tracked and indexed from google or whichever engine in each country!! Is that the case?

@George Thanks for confirming that one...
I left your suggestion last because I think that ChatGPT will be also a way to go for the next topic that I'm gonna post in here!

3 Likes
14

in my case, the default langage which google would see is defined in teh .js

TranslateElement({pageLanguage: 'en'

I guess you would need to p[arrse in the browser language using {{browser1.language}} in place of the "en" to do that

1 Like
15

Thanks Brian, If I understand correctly this is what @franse's suggested, right?

16

Kind of a hybrid between @jpena and @franse with a sprinkling of me.

1 Like
17

I've used ChatGPT 4o

It has been a lifesaver! Those who speak the languages say it is spot on. Give it a try and then allow someone who is well versed read it. You will be amazed at their opinion of the translation.

1 Like