弊サービスの挙動として、基本的にブラウザ言語を判別し自動的に言語が切り替わりますが、
ユーザー自身によってページ内で言語を手動で切り替えることができます。
以下の手順に従って、手動言語切り替え機能を実装してください。
ステップ 1: 言語切り替え用のリンクを作成
まず、言語切り替え用のリンクを作成し、サイト内に組み込んでください。以下のコード例を参考に、必要な言語のリンクを追加してください。
一度言語切り替えを行うと切り替えた言語情報はブラウザの localStorage に保存されるので、以降ページ遷移した際には自動的にその言語に切り替わるものとなります。
<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>
各リンクに
data-ignore-translate 属性を設定しないと言語切り替えリンク自体も翻訳されてしまいうため、切り替えボタンは翻訳対象外にする必要があります。これにより、言語名が正しく表示されるようになります。補足説明
リンクの
href 属性に、?lang=言語コード の形式でURLパラメータを指定してください。これにより、リンクをクリックした際に、指定された言語に翻訳が行われます。例えば、以下のリンクは英語に切り替える場合は以下の通りです。
<a href='?lang=en' data-ignore-translate>英語</a>
これでユーザーがページ内で言語を手動で切り替えることができるようになります。