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翻訳のスクリプトをページ下部に読み込ませています。
3. 表示位置を調整する
翻訳ボタンが意図した場所に表示されない場合は、<div id="google_translate_element"></div> の設置位置を変更してみてください。
例えば：
- ヘッダーに設置 →
header.phpに挿入 - サイドバーに設置 → ウィジェットのカスタムHTMLとして挿入
※ただし、1ページ内に1つしか設置することはできませんので、複数箇所の設置を希望する場合はプラグインを使ったボタン設置が良いでしょう。
注意点・補足
- バックアップは必須：テーマファイルを直接編集する場合、子テーマの利用やバックアッププラグインの活用をおすすめします。
- SEOには限定的：Google翻訳はあくまで表示上の翻訳であり、多言語SEO（インデックス）を強化したい場合は、TranslatePress や Polylang を検討しましょう。
- 翻訳の精度に注意：自動翻訳は誤訳の可能性もあるため、企業サイトや正確な情報発信が求められるサイトでは注意が必要です。
まとめ
プラグインを使わずにGoogle翻訳を導入する方法は、サイトを軽量に保ちたい方や、柔軟に設置したい方にとって非常に便利な手段です。
コードをコピペするだけで実装できる手軽さも魅力ですが、編集ミスはサイト全体の表示崩れにつながる可能性があるため、必ずバックアップを取った上で行いましょう。
本記事が、自サイトの多言語対応への一歩になれば幸いです。
コメント