Last Updated: February 25, 2016
· williankeller

Translate content inline with JavaScript only

Translate your inline content, quickly and easily, without refreshing the page and without the use of jQuery.

How to use:

  • Set the class you want to use as a translation (default tdr);
  • Enter the translation file in the footer of your website;
  • Start translation object using the data in json format ;

Example usage

  • Translation class (Default tdr):
<div class="tdr">Conteúdo à ser traduzido</div>
  • Translation object with the content:
Tradutor({"Conteúdo à ser traduzido": "Content to be translated");

The above method is the simplest to translate an inline content.
Simply insert the base of content and content translation.

Translation inline dynamic content (Default %):

<div class="tdr">Conteúdo JavaScript ser traduzido sem jQuery</div>

Translation object with dynamic content:

Tradutor({"Conteúdo % ser traduzido sem %": "Content % to be translated without %");

The above method is used for replacement of dynamic content, i.e. replaced by the words % are retained.

In the example cited, Conteúdo % ser traduzido sem % print Conteúdo JavaScript ser traduzido sem jQuery the words JavaScript and jQuery they will not be changed.

This goes for numbers, texts and / or special characters.

... and ready, the content is already translated. You can define multiple languages and calls them for every occasion.
Simple and usual super.

See and implement this code on GitHub or Demo.

2 Responses
Add your response

Ok, cool. But what about multiple languages?

over 1 year ago ·

Hello @george-silva, you can see multiple languages on git page.
Please follow this URL:

over 1 year ago ·