Google translate で初回アクセス時に自動で任意の言語を選択済の状態にする

無料のGoogle translateウィジェットは、100以上の言語をプルダウンで選択して、サイトを自動翻訳してくれます。
Google translateの導入はこちらを参照ください。https://translate.google.com/manager/website/?hl=ja
また、サイトのURLの末尾にhttp://XXXXXX.com/#googtrans(en) のように記述するとアクセス時に任意の言語を選択済にできます。
一度選択済の状態になると、cookieに保存され、同一セッション中は選択済の言語が引き継がれます。
よい使い方とは言えないかもしれないですが、Googleなどの検索エンジンから訪れたユーザーのPCやスマホの言語設定が外国語の場合、自動で母国語の言語に選択済の状態にすることもできます。
ただ、本人が任意に選択したい言語を尊重することも必要なので、URLに#googtrans(en)が含まれなく、cookieにもGoogle translateの値がないことをチェックすることも必要です。

▼Cookie有無をチェックして同サイト既にGoogle Translateの設定が保存されていない場合に、言語を強制的に英語

var st="";
var thisurl = location.href ;
//URLに#googtransが含まれない場合
if( thisurl.indexOf('#googtrans')== -1){
 //Cookieに何かしら情報がある場合
 if(document.cookie.length>0){
  st=document.cookie.indexOf("googtrans" + "=");
  //Cookieにgoogtrans=がない場合
  if(st== -1){
   //強制的に#googtrans(en)を付加して英語適用済ページへ
   location.href=thisurl+"#googtrans(en)";
  }
 }
}

▼ユーザーの利用端末の言語設定を取得して、それぞれの言語にGoogle translateで選択済の状態で再読込する


//Google transrate の言語切替用URLのベース
var transurlpass = "/#googtrans";

//最優先の言語だけ取得
var language = (window.navigator.languages && window.navigator.languages[0]) ||
window.navigator.language ||
window.navigator.userLanguage ||
window.navigator.browserLanguage;

// クライアント側で受け付けている言語リストを取得
var languages = window.navigator.languages || [
window.navigator.language ||
window.navigator.userLanguage ||
window.navigator.browserLanguage
];

// alert("最優先"+language+" 言語リスト"+languages);

//IEで取得した言語の値の文字列が完全一致しないケースを想定し indexOf("ko") が含まれていたらで対応
//※中国2種は完全一致が必要なうえiphoneは”zh-cn”のように小文字で応答するためor条件分岐で対応
if(language.toLowerCase().indexOf("en") !== -1){location.href=transurlpass+"(en)";}
else if(language.toLowerCase().indexOf("ko") !== -1){location.href=transurlpass+"(ko)";}
else if(language=="zh-CN"|| language=="zh-cn"){location.href=transurlpass+"(zh-CN)";}
else if(language=="zh-TW"|| language=="zh-tw"){location.href=transurlpass+"(zh-TW)";}
else{location.href=transurlpass+"(en)";} 

ブラウザの言語設定をチェックしますが、ブラウザによって言語コードが若干違うものがあります。主にIE系とEdge、あとsafari も中国系の言語が違った。。
取得した言語コードをそのまま、#googtrans(言語コード)に自動で割り振ることで、1行で全言語に対応できそうですが、ブラウザによって取得できるコードが違うとうまく動かない場合もありそうです。今回は主要な言語をいくつかチョイスして、それ以外は英語(en)へとなるようにしました。

 

 

コメントを残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください