· 

サイトにGoogle翻訳ツールを埋め込んで多言語対応に

以前の記事で「YouTubeからサイトに飛んできて下さる方のために外国語対応サイトを自動生成してくれる機能があればいいのに」と書いていたんですが、ネット検索しましたところ、まさにそんな機能が存在していました。

 

今回ご紹介する、Google翻訳ウィジェットをサイトに埋め込むという方法です。

 

方法は簡単、Google Translate My Pageで必要事項を入力してコードを取得するか、面倒ならば以下のソースをウィジェットを入れたい場所に追加するだけです。

 

<div id="google_translate_element"></div><script>function googleTranslateElementInit() {  new google.translate.TranslateElement({    pageLanguage: 'ja'  }, 'google_translate_element');}</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

 

そうすると、こんなウェジェットが表示されます。

 

Google翻訳ツール
※これは画像です。ページ内に複数設置するとおかしくなるみたいですので。

 

私も早速、右のサイドバーの下の方に設置して試してみました。

機械翻訳という事を承知で割り切るなら、何とかおおよその意味は伝わりそうですね。

 

日本語用に作ったサイトですから、結構レイアウトは崩れますけれども、当サイトのような作りであればまあ許容範囲でしょう。

 

サイドバー内ですとスマホ用サイトでは使えないのですが、当サイトにお越しいただく外国の方は、ほとんどYouTubeかpixiv経由のPCによる閲覧の方と思われますので問題ないと思われます。   →レスポンシブwebデザイン化された時に表示されるようになりました!

 

ちなみに、翻訳させたくない箇所は

 

<div class="notranslate"> ~ </div>

 

で囲みます。

 

自称「ワールドワイドなミュージシャン」の私としましても、これで少しは外国の方にもコンテンツを楽しんでいただけるようになるのでしたら幸いです。