(デベロッパーコンソール用のctrl +シフト+ Jを参照)要求をキャプチャする素敵な有用性を有します。私はスペイン語のサイトを持っており、それを英語に翻訳するまでは、Google Website Translatorを使用する可能性があります。ユーザーが英語のフラグをクリックすると、Webサイトがまだ翻訳されていないことをユーザーに知らせるTwitter Bootstrapモーダルが開き、クリックして翻訳をトリガーすることができるボタンがあります。私はJavaScriptでイベントをキャプチャし、 '/ es/en'という値でクッキー 'googtrans'を設定し、ページをリロードします。 Googleのスクリプトは残りの部分を処理します。リロード後、私はクッキーが存在するかどうかをチェックし、スペイン語のフラグの英語のフラグを変更します。ユーザーがクリックすると、クッキーを ''(空文字列)に設定し、ページをリロードします。
簡単にするために、私はブートストラップモーダル部分を含めません。
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');
}
});
、あなたがリストに表示する言語を選択することができます。 <select>
ここで、それぞれ<option>
には、value
として、必要なクッキーの値、またはdata-cookie="value"
のようなフラグを持つ通常のリストがあります。次に、JavaScriptを使用して、リストの 'change'イベント(selectの場合)または 'click'イベントを取得し、適切にクッキーを設定します。
注:私は意図的にウェブサイトの翻訳がレンダリングされるdivの削除:
<div id="google_translate_element"></div>
は、それが動作を確認するには、あなたがwww.viajoasalta.comを訪問することができますが、少なくとも私たちが最終的にそれを翻訳するまで、少なくとも。
これまでに何がありますか? – Hannele
非稼働リンクの翻訳バナー。私はバナーを望んでいない、私は動作する/リンクするリンクが欲しい。 – ilhan
更新:Firefoxで;動作するリンクを持つバナー。 IE 8では何もありません。 – ilhan