GTranslateは、テキストやウェブページを様々な言語に翻訳するサービスです。Googleが提供するこのツールは、ユーザーが入力したテキストを即座に別の言語に翻訳する機能を持っています。無料でも使用できショートコードを組み込むだけで、簡単に実装ができます。実装の難易度が低くシンプルに設定できるところが魅力です。以下に具体的な実装方法を示します。参考にしていただければ幸いです。
読者GTranslateの使い方は、最初にどこを理解するとよいですか？
木村WordPress標準機能、プラグインの機能、テーマ側の処理を分けて考えると、どこを変更すべきか判断しやすくなります。
読者実際に試すときは、手順だけでなく確認方法も知っておいた方がよいでしょうか？
木村はい。この記事では、作業の目的から実装後の確認までを順番に整理します。自分の環境と照らし合わせながら読み進めてください。
実装内容
実装内容はこちらのリンクから参照いただけます。
実装内容で押さえたいポイント
実装内容は、コードや設定だけを切り離して覚えるより、何を変えるための処理なのかを確認してから試すと理解しやすくなります。変更前の状態を控え、作業を一つずつ反映すると、問題が起きた場所も特定しやすくなります。
実装内容の確認方法
ローカル環境で変更し、未ログイン状態と管理者状態の両方で表示を確認します。PHPを変更した場合は、エラーログ、権限、エスケープ処理も合わせて確認してください。
GTranslate
公式リンク
https://ja.gtranslate.io/
ウェブサイトの翻訳は売り上げを伸ばします
引用元 GTranslate 公式サイト
英語圏の国に住んでいる場合は、ウェブサイトのコンテンツの翻訳を検討していない可能性があります。 しかし、Web管理者の多くが、世界中のユーザーにネイティブ言語でアピールできるコンテンツを含むことの重要性を徐々に認識し出しています。 世界インターネット統計 (the World Internet Statistics) によれば、英語話者はインターネットユーザー全体の27%に過ぎないのです。 さらに、コモンセンス・アドバイザリー社 (the Common Sense Advisory) によって実施された調査によると、オンラインショッピング利用者の85%が、サイト内のその他の言語を理解できていたにも関わらず、彼らのネイティブ言語によって製品が説明されているウェブサイトだけを利用して実際に製品を購入することがわかりました。
GTranslateで押さえたいポイント
GTranslateは、コードや設定だけを切り離して覚えるより、何を変えるための処理なのかを確認してから試すと理解しやすくなります。変更前の状態を控え、作業を一つずつ反映すると、問題が起きた場所も特定しやすくなります。
GTranslateの確認方法
ローカル環境で変更し、未ログイン状態と管理者状態の両方で表示を確認します。PHPを変更した場合は、エラーログ、権限、エスケープ処理も合わせて確認してください。
実装方法
WordPressでGTranslateを実装するには、主にプラグインを使用する方法があります。以下は、WordPressサイトにGTranslateを実装する手順です。
1. GTranslate プラグインをインストールする
- WordPressのダッシュボードにログインします。
- 「プラグイン」>「新規追加」に移動します。
- 検索バーに「GTranslate」と入力し、検索します。
- 「GTranslate」プラグインを見つけたら、「今すぐインストール」をクリックします。
- インストールが完了したら、「有効化」をクリックします。
2. GTranslate プラグインを設定する
- WordPressダッシュボードの左側のメニューで、「設定」>「GTranslate」と進みます。
- 設定ページで、翻訳したい言語、表示オプション、その他の設定を選択します。
- 設定が完了したら、「変更を保存」をクリックして設定を保存します。
ショートコード
ショートコードにも対応しており、テキストエディタやブロックエディタ内に以下のコードを添付することでご使用いただけます。表示する箇所を設定することができるため、ショートコードの使用がおすすめです。
ブロックエディタ
ブロックエディタ内のショートコードを選択し、以下のコードを記述しす。[ gtranslate ]
直接PHPのコードは記述できないため、公式が準備しているショートコードを組み込む必要があります。
テキストエディタ
VscodeやCursorなどWordpressの関数を使ってショートコードを組み込むことができます。
<?php echo do_shortcode('[ gtranslate ]'); ?>※ブロックエディタ内では正しく表示されなかったため、ショートコード内にスペースを組み込み表示しております。コピーの際はスペースを外してください。
ショートコードで押さえたいポイント
ショートコードは、コードや設定だけを切り離して覚えるより、何を変えるための処理なのかを確認してから試すと理解しやすくなります。変更前の状態を控え、作業を一つずつ反映すると、問題が起きた場所も特定しやすくなります。
ショートコードの確認方法
ローカル環境で変更し、未ログイン状態と管理者状態の両方で表示を確認します。PHPを変更した場合は、エラーログ、権限、エスケープ処理も合わせて確認してください。
デザインの紹介
様々デザインが用意されており、それぞれのニーズに合わせた対応が可能です。
これらは無料で提供されています。有料版になれば、より高度なカスタマイズも可能です。
自動翻訳でお悩みの方はぜひこちらを取り入れてみてください。
デザインの紹介で押さえたいポイント
デザインの紹介は、コードや設定だけを切り離して覚えるより、何を変えるための処理なのかを確認してから試すと理解しやすくなります。変更前の状態を控え、作業を一つずつ反映すると、問題が起きた場所も特定しやすくなります。
デザインの紹介の確認方法
ローカル環境で変更し、未ログイン状態と管理者状態の両方で表示を確認します。PHPを変更した場合は、エラーログ、権限、エスケープ処理も合わせて確認してください。
実装前に確認しておきたいこと
ここでは、GTranslateの使い方を実際の制作へ取り入れる前に、準備しておきたい内容を整理します。先に作業範囲と確認方法を決めておくと、既存ページへの影響を抑えながら進められます。
作業の目的と変更範囲を決める
WordPress標準機能、プラグインの機能、テーマ側の処理を分けて考えると、どこを変更すべきか判断しやすくなります。 サンプルをそのまま貼り付ける前に、どのページ、どの要素、どの利用者へ影響するのかを書き出してください。目的が明確であれば、必要以上にコードや設定を増やさずに済みます。
元の状態へ戻せるようにする
テーマや設定を変更するときは、対象ファイルや設定値のコピーを残します。複数の変更を一度に行わず、一つ反映するたびに表示と動作を確認すると、問題が起きても原因を切り分けやすくなります。
よくあるつまずきと確認方法
GTranslateの使い方が期待どおりに動かない場合は、コードを追加し続ける前に、読み込み順、対象要素、設定値、キャッシュの順で確認します。小さな入力ミスや確認条件の違いが原因になることも少なくありません。
変更が反映されない場合
保存したファイルと表示中のページが対応しているかを確認し、キャッシュを消して再読み込みします。ブラウザーの開発者ツールやWordPressのエラーログを確認すると、読み込み失敗や記述ミスを見つけやすくなります。
公開前の最終確認
ローカル環境で変更し、未ログイン状態と管理者状態の両方で表示を確認します。PHPを変更した場合は、エラーログ、権限、エスケープ処理も合わせて確認してください。
まとめ
- 自動翻訳機能を簡単に導入することができる
- ショートコードの活用が便利
- ブロックエディタとテキストエディタで記述の仕方が変わる
- ショートコードで表示させたい位置に設定できる
- 上記は無料プランで使用可能
導入手順だけでなく注意点も書かれていて参考になりました。自動翻訳したページを検索結果へ出したい場合は、別途SEO面の検討が必要という理解で合っていますか？
はい、その理解で合っています。翻訳ページを検索結果へ出す場合は、言語ごとのURL、hreflang、canonical、翻訳品質などを含めて設計する必要があります。自動翻訳を表示できることと、検索向けの多言語ページを用意することは分けて考えるのが安全です。