簡単!グーグル翻訳で自社サイトを多言語化

Nov 26, 2016

簡単!グーグル翻訳で自社サイトを多言語化

2016-11-26 最終更新日:2016-11-26
blog web google translate グーグル 翻訳

今回は簡単にサイトを多言語化する方法をご紹介します。 当サイトにも実装しておりますが、5分で出来ます。翻訳ツールにはグーグル翻訳を使います。翻訳精度はご存じだと想いますがたまに変な翻訳しますのでご理解の上ご使用ください。最近はだいぶ翻訳精度も上がっております。当然ですがグーグルアカウントが必要になります。

ビジネス向けツールのグーグル翻訳を使います。下記公式サイトです。 ⇒ウェブサイト翻訳ツール


スポンサーリンク


導入方法

上記のサイトのウェブサイト翻訳ツール(無料)の使ってみるをクリックします。

ウェブサイト翻訳ツール

今すぐウェブサイトに追加をクリックします。ここでグーグルアカウントを聞かれるのでログインします。

ウェブサイト翻訳ツール

ウェブサイトのURLをウェブサイトの言語を日本語します。

ウェブサイト翻訳ツール

翻訳する言語をチェックボックスにチェックを入れて言語指定します。今回は英語と中国語を選択しました。その他あればチェック入れます。

ウェブサイト翻訳ツール

これで完了です。コードが記述されていますのでこれを表示させたい場所に記述します。

<div id="google_translate_element"></div>

こちらのタグは表示させたい場所に記述します。

<script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'ja', includedLanguages: 'en,ja,zh-CN,zh-TW', layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

jsスクリプトは</body>直前に入れるときれいに表示されます。

参考になれば幸いです。


∞Tadashi Suyama∞

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

Similar Posts

最近の投稿

アイキャッチ
anime.jsの使い方

今回はオブジェクトに動きを加えたり、ちょっとしたアニメーションを付け加えるのにとっても役立つアニメーションライブラリのご紹介です。 anime.jsはとっても軽量でかつ簡単に使えるので去年あた...

18 Feb 2017

アイキャッチ
鳥取県米子市の大雪での現状報告

先月に続いてまた大雪です。鳥取市の方がだいぶ雪が積もっていますね。90cmとは。。。 先月同様駐車場から出られないほど雪が積もりました。今日は雪かきで疲れました。。。週末で助かった部分がありま...

12 Feb 2017

アイキャッチ
親要素をクリックしたら子要素のリンクを発動させる方法

システム上の設定で自動的にはき出すhtmlの場合とかに有効な手段かもしれません。 a要素が複数でてきてその上の要素をクリックしたら下の要素が発動するような仕組みです。 例えばli要素の中にdi...

04 Feb 2017

アイキャッチ
ワードプレスでデバッグログをダッシュボードに表示させる方法

ワードプレス運用中のサイトのエラーログを出力させてそれをダッシュボードで見る方法をご紹介します。 ログ出力方法は結構いろいろなサイトに書かれているのですがそれをダッシュボードに表示させる方法が...

28 Jan 2017

アイキャッチ
bttn.cssで簡単にボタン作成

簡単にボタンが設置できるbttn.cssのご紹介です。数も12種類のボタンだけで色と大きさが指定できます。 容量も少ないのでさくっと出来ます。下記公式サイトからダウンロードして使うかcdnjs...

21 Jan 2017

著者

ウェブエンジニアのSUYAMAのブログです。

WEBに関することや個人的に関心のあることについて書きます。主に技術系ブログです。

フッターイメージ