Localizing Widgets for Global Audiences

Ask the Community General Questions
,
1

Some of my friends are admiring the Elfsight widgets from last few months. So, recently one of my clients approached me to use Elfsight widgets on thier language and translation services based website to serve a global audience.

Can you please explain me its features, that what are best practices for localizing widgets to make sure that these designs are user-friendly for different languages and regions?

1 Like
3

Hi there, @muhammad_ali :wave:

I am afraid I didn’t quite understand your question. What widgets are you interested in: only Website Translator or maybe another ones?

If you mean the Website Translator widget only, it translates the whole content of the page where it’s installed to the chosen language.

If you have any further questions, please describe them in more detail :slightly_smiling_face:

1 Like
4

Hi @muhammad_ali, we’re so happy you’re considering our widgets :smiling_face:

I agree with Max, some more details about your use case and what widgets you’d love to use could help us better understand your needs :slight_smile:

However, if you’re referring to the Website Translator widget, we have some more info about it in this post. Actually, I recommend testing the widget out to see what features and options it includes. And if you have any specific questions, feel free to ask us here!

1 Like
5

My question is

Many plugins are there to translate one language into a specific language but I want my content to be translated across all countries and all famous languages according to the geography of the users.

So I have two options, first one is to use these plugins(but such multiple plugins will crush my website speed optimization factors, so I am more interested in such dsigns that should be allocated according to the locations of users(if any feature exist till date).

We are offering certified translation services, so you can get that proper translation is always important in such cases.

So, I am interested in this.

Hopefully, you will get my response.

Thanks

1 Like
6

Hi there, @muhammad_ali :wave:

If I got you right, you’d like to implement the automatic translation of the page based on the user’s language.

In this case, you need to add the needed languages to your Website Translator widget and add this script to your website’s head:

<script>
        (() => {
                const DEFAULT_LANGUAGE = 'en';

                const url = new URL(location.href);

                const key = Object.keys(localStorage).find((key) => key.startsWith('WebsiteTranslator.language'));
                const hasCachedValue = !!JSON.parse(localStorage.getItem(key) || '{ "value": false }').value;

                const language = navigator.language.split('-')[0];
                if (url.searchParams.has("lang") || language === DEFAULT_LANGUAGE || hasCachedValue) {
                        return;
                }

                url.searchParams.set("lang", navigator.language);
                history.replaceState(null, '', url);
        })();
</script>

If the default language isn’t English, you need to change it in the 3rd line of the code:

image
image570Ă—318 22.8 KB


This way, the language will be pulled from the user’s browser and the page with the widget will be automatically translated to this language (providing you’ve added this language to your Website Translator widget).

We also guess that it would be great to have this feature in the settings, and I’ve added this idea to the Wishlist on your behalf - Automatically translate the page to the language of the user location

Let me know if you have any further questions :slightly_smiling_face:

1 Like