WordPressサイトに翻訳機能を導入したいけれど、できればプラグインを増やしたくない…そんな方におすすめなのが、Google翻訳のウィジェットを直接コードで追加する方法です。
この方法では、functions.php または header.php に数行のコードを追記することで、Google翻訳ボタンを簡単に設置できます。
プラグインに頼らず、サイトを軽量に保ちたい方や、細かい表示位置を自分で調整したい方に向いている方法です。
ただし、WordPressテーマファイルを編集するため、万が一のトラブルを避けるためにも、事前にバックアップを取ることを強くおすすめします。
また、この <script> を使った「Google Website Translator(無料版)」による多言語対応は、2019年に公式での新規提供が終了していて、公式のサポートなどがなく将来の動作保証などはございません。
しかし、現在でも多くのWebサイトで使用されている方法なため、この記事では翻訳ツールの一つの方法としてご紹介をします。
Google翻訳をWordPressに直接追加する手順
1. 翻訳ボタンのHTMLを挿入
まず、翻訳ボタンを表示したい場所に、以下のコードを記述します。テーマの header.php や footer.php、またはウィジェットエリアでも構いません。
<div id="google_translate_element"></div>
これは、翻訳ウィジェットが表示される場所を指定するためのコードです。
2. functions.phpにスクリプトを追加
次に、Google翻訳を有効にするためのJavaScriptコードを functions.php に追加します。
// Google翻訳機能の追加
add_action('wp_footer', function() {
?>
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'ja',
includedLanguages: 'en,zh-CN,zh-TW,ko,fr,de,es,th,vi',//選択言語設定
layout: google.translate.TranslateElement.InlineLayout.SIMPLE,
multilanguagePage: true,
}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
<?php
});
このコードでは、wp_footer アクションフックを使用して、Google翻訳のスクリプトをページ下部に読み込ませています。
選択言語一覧は以下になります。
| 言語 | コード |
|---|---|
| アフリカーンス語 | af |
| アルバニア語 | sq |
| アムハラ語 | am |
| アラビア語 | ar |
| アルメニア語 | hy |
| アゼルバイジャン語 | az |
| バスク語 | eu |
| ベラルーシ語 | be |
| ベンガル語 | bn |
| ボスニア語 | bs |
| ブルガリア語 | bg |
| カタルーニャ語 | ca |
| セブアノ語 | ceb |
| 中国語(簡体字) | zh-CN |
| 中国語(繁体字) | zh-TW |
| コルシカ語 | co |
| クロアチア語 | hr |
| チェコ語 | cs |
| デンマーク語 | da |
| オランダ語 | nl |
| 英語 | en |
| エスペラント語 | eo |
| エストニア語 | et |
| フィンランド語 | fi |
| フランス語 | fr |
| フリジア語 | fy |
| ガリシア語 | gl |
| グルジア語 | ka |
| ドイツ語 | de |
| ギリシャ語 | el |
| グジャラート語 | gu |
| ハイチ・クレオール語 | ht |
| ハウサ語 | ha |
| ハワイ語 | haw |
| ヘブライ語 | iw |
| ヒンディー語 | hi |
| モン語 | hmn |
| ハンガリー語 | hu |
| アイスランド語 | is |
| イボ語 | ig |
| インドネシア語 | id |
| アイルランド語 | ga |
| イタリア語 | it |
| 日本語 | ja |
| ジャワ語 | jw |
| カンナダ語 | kn |
| カザフ語 | kk |
| クメール語 | km |
| キニャルワンダ語 | rw |
| 韓国語 | ko |
| クルド語 | ku |
| キルギス語 | ky |
| ラオ語 | lo |
| ラテン語 | la |
| ラトビア語 | lv |
| リトアニア語 | lt |
| ルクセンブルク語 | lb |
| マケドニア語 | mk |
| マラガシ語 | mg |
| マレー語 | ms |
| マラヤーラム語 | ml |
| マルタ語 | mt |
| マオリ語 | mi |
| マラーティー語 | mr |
| モンゴル語 | mn |
| ミャンマー語 | my |
| ネパール語 | ne |
| ノルウェー語 | no |
| ニャンジャ語 | ny |
| オリヤー語 | or |
| パシュトー語 | ps |
| ペルシャ語 | fa |
| ポーランド語 | pl |
| ポルトガル語 | pt |
| パンジャブ語 | pa |
| ルーマニア語 | ro |
| ロシア語 | ru |
| サモア語 | sm |
| スコットランド・ゲール語 | gd |
| セルビア語 | sr |
| セソト語 | st |
| ショナ語 | sn |
| シンド語 | sd |
| シンハラ語 | si |
| スロバキア語 | sk |
| スロベニア語 | sl |
| ソマリ語 | so |
| スペイン語 | es |
| スンダ語 | su |
| スワヒリ語 | sw |
| スウェーデン語 | sv |
| タガログ語(フィリピン語) | tl |
| タジク語 | tg |
| タミル語 | ta |
| タタール語 | tt |
| テルグ語 | te |
| タイ語 | th |
| トルコ語 | tr |
| トルクメン語 | tk |
| ウクライナ語 | uk |
| ウルドゥー語 | ur |
| ウイグル語 | ug |
| ウズベク語 | uz |
| ベトナム語 | vi |
| ウェールズ語 | cy |
| コサ語 | xh |
| イディッシュ語 | yi |
| ヨルバ語 | yo |
| ズールー語 | zu |
3. 表示位置を調整する
翻訳ボタンが意図した場所に表示されない場合は、<div id="google_translate_element"></div> の設置位置を変更してみてください。
例えば:
- ヘッダーに設置 →
header.phpに挿入 - サイドバーに設置 → ウィジェットのカスタムHTMLとして挿入
※ただし、1ページ内に1つしか設置することはできませんので、複数箇所の設置を希望する場合はプラグインを使ったボタン設置が良いでしょう。
注意点・補足
- バックアップは必須:テーマファイルを直接編集する場合、子テーマの利用やバックアッププラグインの活用をおすすめします。
- SEOには限定的:Google翻訳はあくまで表示上の翻訳であり、多言語SEO(インデックス)を強化したい場合は、TranslatePress や Polylang を検討しましょう。
- 翻訳の精度に注意:自動翻訳は誤訳の可能性もあるため、企業サイトや正確な情報発信が求められるサイトでは注意が必要です。
まとめ
プラグインを使わずにGoogle翻訳を導入する方法は、サイトを軽量に保ちたい方や、柔軟に設置したい方にとって非常に便利な手段です。
コードをコピペするだけで実装できる手軽さも魅力ですが、編集ミスはサイト全体の表示崩れにつながる可能性があるため、必ずバックアップを取った上で行いましょう。
本記事が、自サイトの多言語対応への一歩になれば幸いです。

