Varios idiomas en un mismo sitio Más videos
Comentarios: 22
Likes: 0 Persona
Duración: 9.11 minutos
Dificultad: Intermedio
Descripción del tema
En ocasiones es necesario crear sitios o sistemas multilenguaje, en este tema se muestra como detectar el idioma del explorador usando PHP, además de permitir que el usuario pueda cambiar el idioma mediante un combo.
Material de apoyo
Es necesario descargar el material de apoyo, descomprimirlo y copiar los archivos al servidor Web que instalamos previamente en nuestra computadora, dentro de la carpeta "lenguaje" que se creó en el tema anterior. Al ejecutar el archivo "multilanguage.php" podemos ver que es exactamente el mismo ejemplo del tema anterior a diferencia de que ahora aparece un combo en la parte superior derecha con algunos idiomas definidos.Detectando el idioma del explorador
Vamos a editar el archivo "multilanguage.php". Al inicio del archivo vamos a escribir el código necesario para detectar el idioma del explorador, esto se hace leyendo el contenido de la variable SERVER de la siguiente manera:$lang = $_SERVER['HTTP_ACCEPT_LANGUAGE'];Con esa instrucción tenemos en la variable "$lang" el idioma del explorador en formato es, en, it, fr, etc… pero si el explorador tiene configurado el idioma propio de un país el valor de la variable "$lang" es diferente, por ejemplo el español de México sería es_MX, el español de Chile es_CL, el de Argentina es_AR, en_UK para el inglés del Reino Unido. Lo que necesitamos hacer es extraer los primeros dos caracteres de la variable "lang" de la siguiente manera:
$lang = substr($lang,0,2);Por último es necesario importar al HTML el fichero con el idioma adecuado, de la siguiente manera:
<script type="text/javascript" src="../ext-2.2/locale/ext-lang-<?php echo $lang; ?>-min.js"></script>Recuerda que se tiene que importar después del archivo "ext-all.js" para que sobrescriba el idioma que Ext JS tiene por defecto, una vez guardados los cambios puedes probarlos actualizando el explorador donde está el ejemplo. En el video se muestran tres diferentes exploradores con lenguajes diferentes.
Cambiar el idioma mediante el combo
Al seleccionar un lenguaje del combo la página se recarga y envía mediante la variable "lang" el lenguaje seleccionado, para este tema no vamos a prestarle atención a cómo lo hace, más adelante explicaré como agregarle eventos a elementos del documento, por ahora enfocaré este tema solo a la detección de idiomas. Es necesario verificar si se recibe el parámetro "lang", pues éste tendrá mayor importancia ya que el usuario ha seleccionado un lenguaje mediante el combo. Si en el request viene el parámetro "lang", entonces importaremos el lenguaje de la traducción solicitada de lo contrario importaremos el idioma del explorador, esto se traduce a código PHP de la siguiente manera:if(!isset($_GET['lang'])){
$lang = $_SERVER['HTTP_ACCEPT_LANGUAGE'];
//es, es_MX, en, en_UK
$lang = substr($lang,0,2);
}else{
//Si el usuario ha seleccionado un lenguaje del combo
}
El siguiente paso es tomar el parámetro "lang" y validar si contiene un lenguaje válido, en este caso vamos a verificar que contenga alguno de los cinco idiomas que soportará el ejemplo, para realizar esto utilizaré un bloque switch.
$lang = $_GET['lang'];
switch($lang){
case 'en':
case 'es':
case 'it':
case 'pt':
case 'ro':
break;
default:
$lang = 'en';
}
Si la variable "lang" contiene en, es, ro, pt o it significa que el contenido de la variable es correcto, por lo tanto no es necesario hacer nada más, pero si no contiene ninguno de estos valores significa que hay un error y le asignamos un valor por defecto, en este caso sería inglés (en).
Conclusión
Esta actividad que acabamos de terminar es suficiente para realizar sitios multilenguaje, como puedes ver fue muy sencillo. Si tienes alguna duda o sugerencia puedes dejarla en los comentarios.Te gustaría recibir más tutoriales como este en tu correo?
Este tutorial pertenece al curso Aprendiendo Ext JS 3, te recomiendo revises el resto de los tutoriales ya que están en secuencia de menor a mayor complejidad.
Si deseas recibir más tutoriales como este en tu correo te recomiendo registrarte al curso, si ya eres miembro solo identifícate y registrate al curso, si no eres miembro te puedes registrar gratuitamente!
Si no gustas registrarte en este momento no es necesario! Aún así puedes recibir los nuevos tutoriales en tu correo! Jamás te enviaremos Spam y puedes cancelar tu suscripción en cualquier momento.
Instructor del curso
Regístrate a este curso
Este tutorial pertenece al curso Aprendiendo Ext JS 3, revisa todos los tutoriales que tenemos en este mismo curso ya que están en secuencia y van de lo más sencillo a lo más complicado.
Tendrás acceso a descargar los videos, códigos y material adicional.
Podrás resolver los ejercicios incluidos en el curso así como los Quizzes.
Llevarás un registro de tu avance.
22Comentarios
Como hago para que en el combo aparezca por defecto el idioma del navegador y para que se mantenga ese valor cuando lo modificas? Porque cuando vos cambias de idioma el combo fijate que vuelve a decir por defecto "English".
Tendrías que hacer una comparación cuando pintes el combo y si el idioma es el mismo escribes selected="selected", si necesitas mas ayuda registrate en los foros (http://foro.quizzpot.com) y con gusto te ayudaremos entre todos. saludos
Este Post está genial, tine todo lo que hace falta y la mejor forma de enseñar a todo aquel que quiere aprender. !!!!!!!!!!!!De veras esta genial!!!!!!!!!!
creo que se refiere a cookies, usa cookies
Queridos internautas, no me funciona este ejemplo. Me sale Error: Ext no esta definido
Asegurate de haber descargado la librería de ExtJS y de tener correctamente las rutas en el HTML
Hola No me va, creo q es pq cuando añado las dos letras del lenguaje al script donde se define el idioma <script type="text/javascript" src="../ext-2.2/locale/ext-lang--min.js"> El trozito de código en php no va. Es más ni siquiera se colorea como código php. Alguien sabe q hago mal??? Gracias
Mar, este código no tiene por que tener complicaciones si lo estas guardando correctamente en todo caso trata usando algo asi: <script type="text/javascript" src="../ext-2.2/locale/ext-lang–-min.js”>
verifica que la ruta al javascript del lenguaje este funcionando correctamente.
Yo estoy trabajando con el Ext JS 3.1 y es ext-lang-es.js, esto por si alguno trabaja con esa version, buen dia
a mi me ejecuta el codigo sin errores, pero no me hace nada, es decir, aunque escojo las opciones en el Combo, nunca se hacen los cambios de idioma, no se si influta en que este usando la version 3.1.2. de Ext....les agradeceria si me pudiesen ayudar
Para la versión 3 los archivos de las traducciones se encuentran en "src/locale". Saludos
Agregaría lo siguiente en el combo para que quede seleccionado el idioma elegido, de lo contrario no se puede elegir el primer idioma de la lista. He reemplazado en el código los signos ? en la apertura y en el cierre del código php para que se pueda ver en el blog <option value="en">English <option value="es">Español <option value="it">Italiano <option value="pt">Português <option value="ro">Română (Romanian)
Agregaría lo siguiente en el combo para que quede seleccionado el idioma elegido, de lo contrario no se puede elegir el primer idioma de la lista. \<option value="en"\>English\ \<option value="es"\>Español\ \<option value="it"\>Italiano\ \<option value="pt"\>Português\ \<option value="ro"\>Română (Romanian)\
Agregaría lo siguiente en el combo para que quede seleccionado el idioma elegido, de lo contrario no se puede elegir el primer idioma de la lista.
Agregaría lo que se ve en el link siguiente en el combo para que quede seleccionado el idioma elegido, de lo contrario no se puede elegir el primer idioma de la lista. http://pastebin.com/embed_js.php?i=DupPHiNU
hola me ocurre algo raro me aparecen dos Jcombox y solo uno de ellos me cambia los idiomas por q me sucede eso ?
Porque cuando ejecuto multilanguage.php en cualquier navegador me aparece como una descarga? Alguien me puede ayudar.
para que se mantenga el combo con la opción seleccionada: English English .......... ..........
oye pero tienes que crear la misma pagina 5 veces uno por cada idioma
No, solo tienes que crear 5 archivos JS diferentes, en este caso usamos los que ya trae la librería de Ext e incluimos el que viene en el parámetro. Saludos
No me deja des argar el material de apoyo, amigo, quién es amable de pasarmelo?