弊サービスは、基本的に閲覧者のブラウザ言語を判別して自動的に言語を切り替えますが、ユーザー自身がページ内で言語を手動で切り替えることもできます。本ドキュメントでは、サイトに言語切り替えリンクを設置する方法を説明します。
実装方法は、お使いのサイトが SEOオプションを利用しているかどうかで異なります。まずは下表で該当するケースをご確認ください。
ケース | 翻訳ページのURL | 使うリンク方式 |
SEOオプションなし（通常） | URLは変わらず、同じページ内で翻訳 | 方式A: ?lang= |
SEOオプション・サブドメイン型 | en.example.com のように言語別 | 方式B: 言語別URL |
SEOオプション・ディレクトリ型 | example.com/en/ のように言語別 | 方式B: 言語別URL |
ご自身のサイトがどのケースか分からない場合 翻訳ページのURLがen.example.comやexample.com/en/のように言語ごとに変わるなら、SEOオプションを利用中です（→ 方式B）。 URLは変わらず同じページ内で翻訳されるなら、通常モードです（→ 方式A）。
方式A：SEOオプションを使っていない場合（?lang=）
言語切り替え用のリンクを作成し、サイト内に組み込んでください。以下を参考に、必要な言語のリンクを追加します。
<a href='?lang=ja' data-ignore-translate>日本語</a>
<a href='?lang=en' data-ignore-translate>英語</a>
<a href='?lang=zh' data-ignore-translate>中国語(簡体)</a>
<a href='?lang=fr' data-ignore-translate>フランス語</a>リンクの
href 属性に、?lang=言語コード の形式でURLパラメータを指定してください。これにより、リンクをクリックした際に指定された言語へ翻訳されます。<!-- 英語に切り替える場合 -->
<a href='?lang=en' data-ignore-translate>英語</a>一度言語を切り替えると、切り替えた言語情報はブラウザの localStorage に保存されます。以降のページ遷移でも、自動的にその言語で表示されます。
方式B：SEOオプションを使っている場合（言語別URL）
SEOオプション利用時は、各言語が専用のURL（サブドメインまたはディレクトリ）で配信され、そのURLが正規ページ（canonical）として検索エンジンに登録されます。
この構成では
?lang= 方式は正しく機能しません。- サブドメイン型：言語サブドメイン（例：
en.example.com）の閲覧中は、URLに含まれる言語が優先されるため、?lang=を付けても切り替わりません。
- ディレクトリ型：
?lang=で一旦切り替えても、言語プレフィックスの無いページ（例：example.com/page2）へ遷移した時点で元の言語（ソース言語）に戻ってしまいます。
そのため、SEOオプション利用時は 各言語の正規URLへのリンクを設置してください。
サブドメイン型（en.example.com）の例
<a href='<https://example.com/>' data-ignore-translate>日本語</a>
<a href='<https://en.example.com/>' data-ignore-translate>英語</a>
<a href='<https://fr.example.com/>' data-ignore-translate>フランス語</a>ソース言語（例では日本語）に戻すリンクは、言語サブドメインの付かない元のドメイン（
https://example.com/）を指定します。ディレクトリ型（example.com/en/）の例
<a href='/' data-ignore-translate>日本語</a>
<a href='/en/' data-ignore-translate>英語</a>
<a href='/fr/' data-ignore-translate>フランス語</a>ソース言語に戻すリンクは、言語プレフィックスの付かないパス（
/）を指定します。補足：現在のページのまま切り替えたい場合 上記のリンクは、切り替え後にトップページへ移動します。「今見ているページ」を保ったまま言語だけ切り替えたい場合は、各ページごとに現在のパスを含むリンク（例：https://en.example.com/products/123）を出力する必要があります。これを手動で用意するのが難しい場合は、次の言語切り替えメニュー機能のご利用をおすすめします。
推奨：言語切り替えメニュー機能を使う
管理画面の「言語切り替えメニューを表示する」を有効にすると、言語切り替えメニューをページ上に自動表示できます。このメニューは、現在のページURL（パス・クエリ・ハッシュ）を保持したまま、正しい言語別URLへ切り替えます。
SEOオプション利用時は、手書きのリンクよりもこちらの機能が確実です。各言語の遷移先URLは「言語スイッチャーのカスタム言語設定」で調整できます。
共通の注意点：data-ignore-translate を必ず付ける
どの方式でも、各リンクには
data-ignore-translate 属性を付けてください。<a href='?lang=en' data-ignore-translate>英語</a>この属性を付けないと、言語切り替えリンク自体も翻訳の対象になり、言語名（「日本語」「英語」など）が正しく表示されなくなります。
data-ignore-translate を付けた要素とその内側は翻訳対象から除外され、言語名が常に正しく表示されます。参考：言語が決まる仕組み
translate.js は、ページ表示のたびに次の優先順位で表示言語を決定します。手動切り替えリンクを設計する際の参考にしてください。- URL自体に含まれる言語（サブドメイン
en.example.com/ ディレクトリexample.com/en/）
?lang=クエリパラメータ
- ブラウザの localStorage に保存された言語
- ブラウザの言語設定（自動翻訳が有効な場合）
URLに言語が含まれている（＝SEOオプション利用時）と、それが
?lang= よりも優先されます。これが、SEOオプション利用時に方式B（言語別URL）を使う理由です。