Crea un sito multilingua automatico con jQuery

Crea un sito multilingua automatico con jQuery

Realizzare un sito multilingua può essere un impegno gravoso, ma in alcuni casi risulta indispensabile per rendere fruibili i contenuti da tutti i tipi di visitatori.

Oggi vi voglio mostrare come, in pochi passi, sia possibile avere un sito convertito in oltre 30 lingue senza duplicare o riscrivere nemmeno un file HTML ( come si faceva nella “vecchia scuola”).

Esistono svariati tool online come babelfish, che permettono la conversione della pagina internet e ne restituiscono la versione localizzata nella lingua prescelta, la conversione però avviene dentro un iframe e risulta:

  • poco appetibile dai motori di ricerca
  • rende il sito brutto da vedere
  • la conversione e’ richiamabile dal sito usando un link che riporta al sito babelfish, cosa non molto professionale…

Esiste un’alternativa più professionale e bella da vedere? la risposta e’ si.

Grazie alle fantastiche librerie jQuery e alle API del traduttore Google Traslate e’ possibile. Il Tool online GT Traslate e’ molto esplicativo e ci permette di scegliere quali lingue mostrare e quali no.

Come vedete e’ possibile scegliere anche di inserire un menu’ di selezione dropdown oltre alle classiche “bandierine”.

Una volta composto in nostro widget secondo le nostre esigenze copiamo e incolliamo il codice visualizzato all’interno del “body” della nostra pagina HTML. Solo una breve nota, se vogliamo che il nostro codice sia validato w3C tagliamo le due righe di codice :

<style type="text/css">
<!--
a.gflag {font-size:16px;padding:1px 0;background-repeat:no-repeat;background-image:url('https://joomla-gtranslate.googlecode.com/svn/trunk/mod_gtranslate/tmpl/lang/16.png');}
a.gflag img {border:0;}
a.gflag:hover {background-image:url('https://joomla-gtranslate.googlecode.com/svn/trunk/mod_gtranslate/tmpl/lang/16a.png');}
-->
</style>

e incolliamole dentro il nostro foglio di stile o nell'”head” della pagina, questo perchè, secondo gli standard non e’ permesso avere codice di stile nel corpo del documento. Il metodo di translate “on Fly jQuery” e’ quello che vi consiglio dato che converte la pagina in modo diretto, rimanendo all’interno del dominio e senza modificare l’aspetto della pagina con redirect o codice “sporco”. Tuttavia e’ possibile scegliere anche il metodo di conversione “standard ” con redirect o link “sporcati”.

Nel caso voi usaste Joomla potete usare questo modulo: http://extensions.joomla.org/extensions/languages/automatic-translations/4823

Attenzione!: Lo script va in conflitto con svariati script jQuery per cui, nel caso non funzionasse vi consiglio di leggere come far convivere piu’ script jQuery nella stessa pagina.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.

Up Next:

Galaxy brushes per Photoshop e Gimp

Galaxy brushes per Photoshop e Gimp