Autor Tema: Añadir widget de traducción automática con google translator en blog de blogger  (Leído 6543 veces)

Chino Ozuna

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 1
    • Ver Perfil
Que tal, buen día. Para programar un sitio de Blogger con la opción de que se pueda traducir el idioma del contenido, cómo puedo hacerlo?
« Última modificación: 22 de Septiembre 2015, 08:56 por Ogramar »

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2660
    • Ver Perfil
Hola Chino Ozuna!

Para traducir un sitio "con perfección" es necesario realizar la traducción a mano, ya que los traductores automáticos cometen bastantes fallos.

No obstante, tienen la ventaja de que son rápidos y en algunos sitios puede ser suficiente con poner un traductor automático. Puedes añadir un código en blogger que te dibuja las banderas de otros países de modo que cuando un usuario pulse en una bandera se le muestre el contenido de tu blog traducido automáticamente.

Los pasos a dar son estos:

1) Dentro de Blogger selecciona la opción de menú "diseño"

2) A continuación, en la zona donde prefieras de la vista de diseño, selecciona "Añadir gadget" y escoge el de tipo HTML/Javascript

3) Ahora te aparecerá una ventana en la que podrás introducir el código HTML/Javascript que "dibujará" en el Blog el traductor con banderas.
En la caja para el título puedes o dejarla vacía si no deseas que se visualice un titulo encima del traductor con banderas o rellenarlo con el que prefieras utilizar. La caja de texto "grande" justo bajo el título, será en la que tienes que copiar y pegar el código.

 4) Ahora copia y pega el código fuente que figura a continuación, dentro de la caja de texto grande de la ventana que se te ha abierto al añadir el Gadget HTML/Javascript:

Código: [Seleccionar]
    <a href="https://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXXXXXXXX" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=es%7Cfr&amp;hl=es&amp;ie=UTF8');return false" rel="nofollow" target="_blank" title="Google-Translate-Spanish to French "><img alt="Google-Translate-Spanish to French" src="http://3.bp.blogspot.com/-mhqyv4teiYw/UvqWE18tALI/AAAAAAAALQI/6Nx5YRALk6s/s1600/France.png" style="border: 0 solid; cursor: pointer; height: 32px; width: 32px;" title="Google-Translate-Spanish to French" /></a>

    <a href="https://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXXXXXXXX" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=es%7Cde&amp;hl=es&amp;ie=UTF8');return false" rel="nofollow" target="_blank" title="Google-Translate-Spanish to German"><img alt="Google-Translate-Spanish to German" src="http://2.bp.blogspot.com/-A0UatfV6RQQ/UvqWHz55_FI/AAAAAAAALRE/DWo9jk1PZaM/s1600/Germany.png" style="border: 0 solid; cursor: pointer; height: 32px; width: 32px;" title="Google-Translate-Spanish to German" /></a>

    <a href="https://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXXXXXXXX" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=es%7Cen&amp;en=es&amp;en=UTF8');return false" rel="nofollow" target="_blank" title="Google-Translate-Spanish to English "><img alt="Google-Translate-Spanish to English" src="http://1.bp.blogspot.com/-BbII8VzM4pA/UvqWG90GbCI/AAAAAAAALQ0/oxzXq1pwDuQ/s1600/United+States+of+America+(USA).png" style="border: 0 solid; cursor: pointer; height: 32px; width: 32px;" title="Google-Translate-Spanish to English" /></a>


Hay que tener cuidado y poner el blogID que corresponda. Se pueden añadir más o menos idiomas según se prefiera.

Cada conjunto que va desde  <a href= hasta </a> de cada color, es el código necesario para llamar a Google Translator en el idioma del país al que corresponda dicho código. Si no quieres todas la banderas, simplemente selecciona el código de aquellas que desees utilizar.
El blogID, que en el código aparece en cada bandera como blogID=XXXXXXXXXXXXXXXXXXX , dentro podrás introducir el identificador de tu Blog. El "blogID" es fácil de extraer, es el código de 19 posiciones que se encuentra en la barra de direcciones de tu navegador mientras editas cualquier entrada.

Si quieres que queden centradas las banderas, puedes poner en la parte superior del código con todas las banderas la etiqueta <div align="center">  y cuando finalice todo el código de las banderas que hayas decidido utilizar lo cierras con </div>

Salu2

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".