Ho avuto lo stesso problema qualche giorno fa e si avvicinò con una soluzione che funziona. Ho un sito in spagnolo e, finché non lo traduciamo in inglese, offriamo ai nostri utenti la possibilità di utilizzare Google Website Translator. Quando gli utenti fanno clic su "English flag", viene aperto un modesto Bootstrap di Twitter che comunica all'utente che il sito Web non è ancora stato tradotto e c'è un pulsante su cui è possibile fare clic per attivare la traduzione. Catturo l'evento con JavaScript, imposta il cookie 'googtrans' con il valore '/ es/en' e ricarica la pagina. Lo script di Google fa il resto. Dopo il ricarico, controllo se il cookie esiste e cambia la bandiera inglese per la bandiera spagnola. Quando l'utente fa clic su di esso, imposto il cookie su "" (stringa vuota) e ricarica la pagina.
Per semplicità, non includerò la parte modale Bootstrap.
Html
<!DOCTYPE html>
<html>
<head>
(...)
<meta name="google-translate-customization" content="(YOUR_TRANSLATE_CUSTOMIZATION_ID)" />
(...)
</head>
<body>
(...)
<a id="lang-change-en" class="lang-change" href="javascript:void(0);">
<img src="images/en-flag.png" alt="English Flag">
</a>
(...)
<script src="js/script.js"></script>
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</body>
</html>
Javascript (script.js)
function setCookie(cname, cvalue, exdays) {
var expires;
if (exdays === 0) {
expires = '';
} else {
var d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
expires = "expires=" + d.toGMTString();
}
var domain = (typeof domain === "undefined") ? '' : "; domain="+domain;
document.cookie = cname + "=" + cvalue + "; " + expires + "path=" + path + domain;
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i].trim();
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
//Google provides this function
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'es',
includedLanguages: 'en',
layout: google.translate.TranslateElement.InlineLayout.SIMPLE,
autoDisplay: false
},'google_translate_element');
}
//Using jQuery
$(document).ready(function() {
$(document).on('click','#lang-change-en', function() {
setCookie('googtrans', '/es/en', 0, '.viajoasalta.com');
setCookie('googtrans', '', 0, '/');
location.reload();
});
$(document).on('click', '#lang-change-es', function() {
setCookie('googtrans', '', 0, '/', '.viajoasalta.com');
setCookie('googtrans', '', 0, '/');
location.reload();
});
var googTrans = getCookie('googtrans');
if (googTrans === '/es/en') {
var src = $('#lang-change-en > img').attr('src').replace('en-flag', 'es-flag');
$('#lang-change-en > img').attr('src', src);
$('#lang-change-en').attr('id', 'lang-change-es');
}
});
Nella configurazione guidata Traduttore di siti web, è possibile selezionare le lingue che si desidera visualizzare nell'elenco. È quindi possibile avere il proprio dove ogni <option> ha come valore value il valore del cookie che dovrebbe avere oppure un elenco normale con contrassegni con qualcosa come data-cookie="value". Quindi con JavaScript acquisisci l'evento "modifica" (per la selezione) o "clic" per l'elenco e imposta i cookie in modo appropriato.
Nota: Ho volutamente rimosso il div dove il Traduttore di siti web viene resa:
<div id="google_translate_element"></div>
vederlo lavorare, si può visitare www.viajoasalta.com; almeno fino a quando finalmente lo traduciamo.
Cosa hai ottenuto finora? – Hannele
Banner di traduzione con link non funzionante. Non voglio banner, voglio link che lavori/traduca. Aggiornamento – ilhan
: in Firefox; banner con un link che funziona. In IE 8 niente. – ilhan