Principal | Indice | Ir Arriba
Te recomiendo Rincón Ubuntero

Traductor para blogger usando JQuery que no cambia el estilo de nuestro blog

Todos queremos que nuestro blog sea más internacional y que si tenemos la oportunidad de obtener visitantes de otras lenguas poderlos convencer de quedarse un rato más y volver.
A continuación voy a mostrarles como agregar una bonita caja de banderas para que pueden traducir el blog sin cambiar el estilo de este.

  1. En nuestra sidebar agregamos un nuevo gadget de tipo codigo HTML/Javascript
  2. Le damos un titulo como "En su Idioma" u otro que indique que es un bloque traductor.
  3. Agregamos el siguiente contenido.
  4. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://jquery-translate.googlecode.com/files/jquery.translate-1.4.7-debug-all.js"></script>
    <script type='text/javascript'>
    //<![CDATA[
    function doTranslate(lang_pair) {
    
    if(lang_pair.value)lang_pair=lang_pair.value;var
    lang=lang_pair.split('|')[1];if(lang=='pt')lang='pt-PT';
    jQuery.cookie('glang', lang);
    jQuery(function($){$('body').translate('es', lang, {toggle:true});})
    }
    //]]>
    </script>
    <script type='text/javascript'>
    //<![CDATA[
    function DoTo(Idioma) {
    
    if(Idioma==1) doTranslate('es|es');
    if(Idioma==2) doTranslate('es|en');
    if(Idioma==3) doTranslate('es|pt');
    if(Idioma==4) doTranslate('es|fr');
    if(Idioma==5) doTranslate('es|it');
    if(Idioma==6) doTranslate('es|de');
    
    }
    //]]>
    </script>
    <script type="text/javascript" src="http://jq-ingrid.googlecode.com/svn-history/r6/trunk/js/jquery.cookie.js"></script>
    
    <div class="languages">
    <table border="0">
    <tr>
    <td><a href="javascript:DoTo(1)" title="Español"><img alt="Español" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMZd-KfGhZdyhaCC6hHc9U2PMBgd_Vqi5LmuGzUjMveMaTwhYFlRiFKLs0bItIimeQIE_yh6HFgP867T7MEQzztSlY9fy722WsJXJIoPy9LEQ4b2iUGdgTHUXSezNX9kF2SU7gq1BfUcNd/s1600/es.png" width="30"/></a></td>
    <td><a href="javascript:DoTo(2)" title="English"><img alt="Inglés" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPlyafMz2EUeAtF3V_MFS-o2B1Gbm9klp8CChiNOyAEf2VqsZ9bryjCwAjY2qvtt8IeucT-J0T6gfqpkwGuk2g2II-rT5s3ty6y0IQM8uhZtXQLByAWUGGsDsyg_aV1niaO1_TEKifGysY/s1600/uk.png" width="30"/></a> </td>
    <td><a href="javascript:DoTo(3)" title="Português"><img alt="Portugués" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG5VFkbgBpUBi6Koygk-kkaohF4-lwYtzL3lqCWvJUpUNZRc5O34K8wuZHTQJSnMWGYmW2293tnnSt6VR6QwK6O_xg-TVbMbxbglicxO7A2LtXPHv8pvJL8T8mXQeGW93FsdPBQRDHPTYY/s1600/pt.png" width="30"/></a> </td>
    <td><a href="javascript:DoTo(4)" title="Française"><img alt="Francés" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwFjnSLtNbXFvmKStxxyIgLlGWIoA2oESTmkKEmBcZln_46vyVtNabewFXrY4mgwwnGVBlQOCOrfrwMZupZXjvt7bDbpTnv2VzntX7Ge4F4ub2qzFXdrpUgpPK94zUvnemYXQ3jPrmNYQ8/s1600/fr.png" width="30"/></a> </td>
    <td><a href="javascript:DoTo(5)" title="Italiano"><img alt="Italiano" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn1k5fbZhULImIrLqsXpY_FrK-ZnewOOwMrYsbSIU3gy6c9_P-KretDKLm1WFWckZsGRL4q9l_g3eY39JhFsDq6u-xHruCqCoMtEesqxyfgMDOJXhqqRVQdQTb_UlmPYwcr2e3Bv8WOU_a/s1600/it.png" width="30"/></a> </td>
    <td><a href="javascript:DoTo(6)" title="Deutsch"><img alt="Alemán" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuFcMh0vEXjp5f-ZmAIQyv1tkVakWhT6_J9mLyRb6uHDDCz9FfEB1W-JF_8FZGCquOv9fUb_ZYt0H59bnnoc26lq8iOGFPondZguHbj-4oK9CdYfSRBDXVDvFIlQqbM1KyxqEPYmvsZLQL/s1600/de.png" width="30"/></a> </td>
    </tr>
    </table>
    </div>
    
Esta es mi propia opción y como esta acá no lo van a encontrar en otra parte y como es codigo HTML pueden usarla en cualquier web ubicando el código el en área que desea la herramienta, espero la disfruten y compartan sin olvidad recomendar la fuente.
Español Inglés Portugués Francés Italiano
Alemán

1 comentarios :

  1. hola, tengo curiosidad, como seria agregar dos textbox y traducirlo de un texto a otro?

    ResponderEliminar