Translating a page using Javascript

Question

I am developing a website (in Wordpress) that is designed for users who speak different languages. The main content of the site is the same (not divided into languages). But the interface of the site (for example, menus and some other little things) should be in two different languages.
I do not want to use gettext in the PHP level. Instead, I want to bring some things to the JavaScript level.

Of course, I can make an array of words in both languages, mark html elements that require translation (for example: <span translate='true'>Hello world!</span> ), and when the user clicks their language button, the script for match words and replace the contents of the elements.

But I want to ask, is there a better way to achieve this?

Answer 1

If you only plan to translate menus, sidebars, and other “hard-coded” things in your user interface, I will just use a different (partial) HTML template that has already been translated into this particular language. You could have, for example, header_en.html, header_fr.html, etc.

Translating using JavaScript after the page has been submitted is too complicated for what you are trying to achieve, in my opinion.

Answer 2

I would recommend doing something in Wordpress, even if you don't like the way Wordpress is.

See wp_localize_script for the Wordpress mode for this.

This means using Gettext, but in JavaScript. I think you need to mark the field if you do not have a real problem with Gettext for some reason.

Answer 3

You can use http://jsgettext.berlios.de/ to translate in JavaScript.