web multilenguaje con js

Cómo traducir una web con jQuery

Twins Seven Seven

archivado en: JavaScript / 3 septiembre, 2015

Para el Raúl

Montar una web con distintos idiomas es muy fácil de hacer con jQuery. La jugada en esencia es esta:

1. Montamos jasonakos por cada idioma.

2. Al cargar la página o cuando sea, si el idioma seleccionado no es el que viene por defecto...

3. Cargamos el jasonako que toque y sustituimos todos los nodos que tengan la clase a traducir.

En código:

Armamos tantos jasonakos como idiomas tengamos. Es importante que las claves sean siempre las mismas.

cadenas_en_EN.json

{

"MAIN_TITLE": "Title",

"MAIN_SUMARY": "Sumary"

}

En el html ponemos una clase y un atributo data con la clave que corresponda...

index.html

<body>

<h1 class="js-translate" data-string="MAIN_TITLE">Soy un titular</h1>

<p class="js-translate" data-string="MAIN_SUMARY">Soy un sumario formidable</p>

Y ya solo falta un poco de jQuery (me paso de variables para que se entienda mejor):

<script>

$(document).ready(function() {

var defaultLang = "es_ES",

userLang = location.search.split('lang=')[1];

if ( defaultLang != userLang ) {

archivoCadenas = "cadenas_"+userLang+".json";

$.getJSON(archivoCadenas).done(function(data) {

$('.js-translate').each( function() {

var cadenaka = $(this).attr('data-string');

$(this).text(data[cadenaka]);

});

});

}

});

</script>

Más sencillo que un botijo : )

|| Tags: , ,

valoración de los lectores sobre web multilenguaje con js

  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración negativa
  • estrellica valoración negativa
  • 3.2 sobre 5 (5 votos)

¿Te ha parecido útil o interesante esta entrada?
dormido, valoración 1 nadapensativo, valoración 2 un poco sonrisa, valoración 3 a medias guiño, valoración 4 bastante aplauso, valoración 5 mucho

Tú opinión es muy importante, gracias por compartirla!

3 respuestas a “web multilenguaje con js

  1. Hola Matto, gracias por el aporte.

    Sí, lo conocía, pero quería explicarle a un amigo cómo hacerlo sin plugins : )