Google翻訳APIを使用してサイトを多言語で表示

2013/07/24

Google翻訳でサイトを多言語で表示してみる

概要

Google翻訳APIを使用して、簡単に自分のサイトを多言語で表示する方法を紹介します。
googleTranslateElementInitを定義するだけです。
これを行うと各言語のプルダウンが表示され、プルダウンを選択すると各言語でサイトが表示されます。

自動翻訳のため、確実に正しく翻訳されるわけではありませんが、とても簡単に設置できるので試してみてはいかがでしょうか。

翻訳プルダウンの設置方法

設置するのは本当に簡単で、bodyタグの中に以下のコードを記述するのみです。


<div id="google_translate_element"></div>
<script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'ja', includedLanguages: 'en,de,es,fr,it,pt,ru,zh-CN', 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>

pageLanguageでは、サイトの言語を指定します。

includedLanguages では、翻訳する言語をしていします。

layout では、表示形式を選択します。

上記のコードは、Google ウェブサイト翻訳ツールから取得できますので、是非試してみてください。

  • このエントリーをはてなブックマークに追加
Related

FullCalendarでGoogleカレンダーのようなUIを実装

jQueryプラグインFullCalendarのサンプル 概要 FullCalendarを使用して、GoogleカレンダーのようなUIを実装する使用例を...

PHP Laravel5.2でmulti-auth(複数テーブルでの認証)を実装

Laravel5.2でマルチ認証 概要 LaravelとはPHPの中で今最も伸びているフレームワークです。 処理速度が遅いなどありますが、かなり使い安く拡...

PHP 正規表現でIPアドレス形式の文字列か判定

正規表現でIPアドレスの入力チェック 概要 フォームで入力されたIPアドレスが正当な文字列か判定するためのバリデーション処理を実装します。 基本的...

rbenv環境でRuby on Railsのアプリケーションを一瞬で自動生成

アプリケーション構築時に最初に行う手順 概要 アプリケーションを作成するまでの手順を記載しています。 rbenvなどの環境が設定済と仮定して話を進めま...

Rails devise・authority・rolifyで権限付きの認証機能

devise・authority・rolify 概要 3つのGemを使用して、権限付き認証機能を実装します。 gem インストール Gemfile ...

Rails devise で複数モデルの認証機能を実装

Rails devise で複数モデルを管理 概要 rails のログイン認証 Gem「devise」のインストール・設定方法を紹介します。 よく「d...
トップへ戻る