Magentoで言語スイッチャーを設定する方法

 Magentoでの夏の終わりのセール、期間限定オファー
目次

言語スイッチャーの設定 を Magento で行うことは不可欠です。この機能は、国際的なオーディエンスをターゲットとするウェブサイトにとって極めて重要であり、言語を簡単に切り替える機能は、現在の市場での緊急のニーズとなっています。

最初は気が遠くなるように思われるかもしれませんが、このガイドでは、Magentoウェブサイトに言語スイッチャーを効率的かつ効果的に設定する手順を説明します。これらの指示に従うことで、この貴重な機能をスムーズに実装し、サイトの多様な多言語オーディエンスへの対応能力を高めることができます。.

Magentoの言語切り替えを設定する理由

 Magento コマースプラットフォームツールの図解

Magentoに言語切り替えを設定すべき4つの主な理由を紹介します。.

  1. ユーザーエクスペリエンスの向上: 言語切り替え機能により、訪問者は自分の好みの言語でコンテンツにアクセスでき、ウェブサイトへの理解と関与が向上します。たとえば、英語ベースのMagentoストアを訪れるスペイン語話者が簡単にスペイン語に切り替えることができ、商品の閲覧、説明の読み取り、購入手続きがより簡単になります。
  2. 市場範囲の拡大: 多言語対応により、世界中の顧客をターゲットにし、新しい市場への進出が可能となり、顧客基盤と売上を拡大できる可能性があります。たとえば、米国にあるオンライン衣料品店が、英語、フランス語、ドイツ語のオプションを備えた言語切り替えを実装しています。これにより、カナダやその他のヨーロッパ諸国への別途ウェブサイトを作成することなく、自社製品を効果的に販売できます。
  3. SEOパフォーマンスの向上: 適切に実装された言語スイッチャーは、多言語SEOの取り組みを強化し、異なる言語や地域での検索結果におけるサイトの可視性を高めます。たとえば、Magentoベースの電子機器ストアは、英語と日本語の両方でコンテンツを提供しています。日本語ユーザーが自国語で製品を検索すると、日本語ページが検索結果に表示されやすくなり、よりターゲットを絞ったトラフィックを獲得できます。
  4. コンバージョン率の向上: 訪問者が製品の詳細、ポリシー、購入手続きを母国語で理解できる場合、取引を完了して顧客になる可能性が高くなります。たとえば、国際的な美容製品店を閲覧しているイタリア人の顧客がMagentoでイタリア語に切り替えるオプションを見つけます。これにより、製品の成分、使用方法、配送ポリシーを簡単に理解できるようになり、購入への自信が高まります。

これらの機能を実装することで、Magentoストアは多様なグローバルオーディエンスにとってよりアクセスしやすくユーザーフレンドリーになり、潜在的にWebトラフィックの増加、エンゲージメント、売上を促進します。

Magentoに言語スイッチャーを設定する方法

ウェブサイト翻訳サービスは通常、この機能を提供しており、お客様の特定の要件に合わせてカスタマイズできます。.

ただし、すべての翻訳サービスが簡単にカスタマイズできてユーザーフレンドリーな言語切り替え機能を提供しているわけではないことに注意することが重要です。したがって、さまざまなフレームワークと互換性があり、柔軟な言語切り替え機能を提供する自動翻訳サービスを選択することが重要です。.

これらの条件を満たすサービスとして Linguiseが際立っています。簡単にカスタマイズでき、ユーザーフレンドリーな言語切り替え機能を提供し、 Magentoとシームレスに統合されます。.

LinguiseLinguiseのスムーズな統合により、Magento CMSを使用すると、マルチ言語ウェブサイトに言語スイッチャーを簡単に組み込むことができます。 さらに、Linguiseの機能と直感的なインターフェイスにより、Magentoウェブサイトでの言語スイッチャーの設定と維持が大幅に簡素化されます。以下のセクションでは、LinguiseをマルチリンガルなMagentoウェブサイトにインストールし、言語スイッチャーを設定する手順を概説します。

言語の壁を壊す
言語の障壁に別れを告げ、無限の成長にこんにちは!私たちの自動翻訳サービスを今すぐお試しください。.

ステップ1: 無料の Linguise アカウントに登録する

まず、Linguiseアカウントに無料でサインアップし、1か月のトライアル期間を利用してください。登録プロセスは簡単で、ログイン資格情報を作成するためにメールアドレスを提供するだけです。

このトライアル期間中、 Linguiseの豊富な機能を利用できます。トライアル期間が終了すると、自動的に Linguise ダッシュボードにリダイレクトされます。.

ステップ2: ドメインウェブサイト Magentoを追加する

Linguise情報を追加する必要があります。「ドメインを追加」オプションを探してクリックします。その後、入力するフィールドがいくつか含まれたフォームが表示されます。

  • アカウントの詳細
  • ウェブサイトURL
  • プラットフォームの選択( Magentoを選択)
  • サイトのメイン言語
  • 翻訳したい言語
  • URLを翻訳するオプション
  • 動的コンテンツ翻訳の設定

必要な情報をすべて入力したら、「次へ」ボタンをクリックします。.

暗い画像に薄いテキストと線が見えます。画像はWebページまたはドキュメントのスクリーンショットのようです。.
薄い灰色のテキストと線が入った暗い画像。低解像度のスクリーンショットのようです。.

次の段階では、APIキーを入力する必要があります。このキーは設定プロセスに不可欠であり、提供されます。.

YouTube動画のスクリーンショットと翻訳ツール

ステップ3: Linguise スクリプトをアップロードする

次のステップでは、 Linguise 翻訳スクリプトを Magento サーバーに追加します。

  1. LinguiseからPHP-JS翻訳スクリプトを取得します。.
  2. ダウンロードしたファイルの内容を抽出する.
  3. 抽出したファイルを、 Magento インストールのメイン ディレクトリに転送します。.

以下のことを確認してください:

  • スクリプトは、ウェブサイトのトップレベルディレクトリに、 Magento ファイルとともに配置されます。.
  • フォルダ名は元のままの「linguise」となる。.
コンピューターファイルシステムのスクリーンショット。.

続いて、アップロードしたばかりのConfiguration.phpファイルに Linguise APIキーを組み込む必要があります。このファイルを編集用に開き、プレースホルダーテキスト「REPLACE_BY_YOUR_TOKEN」を探し、実際のAPIキーに置き換えて、引用符内に保持します。.

構文ハイライト表示されたコードスニペット.

ステップ 4: Magento の URL 書き換えを設定する

Magentoストア > 設定 > コンフィギュレーション > 一般 > ウェブ > 検索エンジン最適化

そこに移動したら、「Webサーバーリライトを使用する」オプションを見つけて有効にします。.

Azure設定ページ。Microsoft Azureの設定。.

次に、.htaccessファイルで言語固有のURLを設定する必要があります。デフォルトの Magento 2 .htaccessファイルを開き、「RewriteEngine on」という行を探します。この行の直後に、特定のコードスニペットを挿入します。.

この構成により、 Magento は、サイトの異なる言語バージョンのリクエストを適切に処理およびルーティングし、多言語設定を強化します。. 

変更を加える際には、.htaccessファイルの変更には注意が必要です。誤った変更はサイトの機能に影響を与える可能性があります。自分で変更を行うのが不安な場合は、 Magento の設定に精通している開発者に支援を依頼することを検討してください。.

				
					<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteRule ^(af|sq|am|ar|hy|az|eu|be|bn|bs|bg|ca|ceb|ny|zh-cn|zh-tw|co|hr|cs|da|nl|en|eo|et|tl|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|ko|ku|ky|lo|la|lv|lt|lb|mk|mg|ms|ml|mt|mi|mr|mn|my|ne|no|ps|fa|pl|pt|pa|ro|ru|sm|gd|sr|st|sn|sd|si|sk|sl|so|es|su|sw|sv|tg|ta|te|th|tr|uk|ur|uz|vi|cy|xh|yi|yo|zu|zz-zz)(?:$|/)(.*)$ linguise/linguise.php?linguise_language=$1&original_url=$2 [L,QSA,END]
</IfModule>

				
			

ステップ5:言語スイッチャーの有効化とカスタマイズ

言語切り替えは、ユーザーが優先言語を選択できるフラグポップアップです。これを読み込むには、Webサイトの設定の最後に提供されているコードをコピーして、HTMLページのヘッドに貼り付けます。フラグ言語切り替えは自動的に読み込まれます。.

ウェブサイトヘッダーにコピーしてロードするコードは、Linguise ダッシュボードのドメイン > 設定 > タブ > スクリプトPHPに移動して見つけることができます。

白黒の空白の画像。背景のテクスチャ。.

このコードはページのヘッダーに挿入する必要があります。 Magento 2では、設定を通じてページのヘッダーにコンテンツを追加できます。.

デザイン構成テーブルのスクリーンショット

管理パネルで、コンテンツ > 設定に移動し、デフォルトのストアテーマビューを編集します。次に、HTMLヘッドセクションをクリックし、コピーしたスクリプトをスクリプトとスタイルシートの入力フィールドに貼り付けます。最後に、設定を保存します。

右側に灰色の円があり、白いテキストが表示された黒い画面。テキストはエラーメッセージのようです。.

言語スイッチャーは最初、ウェブサイトの右下にフローティング表示されます。その表示と配置は、Linguise ダッシュボード > 設定 > 言語フラグ表示からカスタマイズできます。

ステップ6:メインディスプレイの設定

言語切り替えボタンはデフォルトでウェブサイトの右下にフローティング表示されます。ダッシュボードのLinguise設定 > 言語フラグ表示

言語フラグ表示の設定メニュー

ステップ7:フラグのデザインを設定する

メインディスプレイの設定を調整した後、言語フラグのデザインをさらにカスタマイズできます。.

  • 言語名の表示:
  • 英語フラグタイプ:
  • 旗のスタイル: 旗のアイコンの形状をラウンドまたは矩形から選択します。
さまざまなフラグの種類と言語を示すスクリーンショット。.

ステップ8: 色とサイズを設定する

フラグのデザインを決定した後、次の設定でフラグの色とサイズをカスタマイズできます:

  • 旗の境界線半径: 矩形の旗スタイルの境界線半径をピクセル単位で調整します。
  • 言語名の色: 言語名のデフォルトのテキスト色を選択します。
  • ポップアップ言語の色:
  • フラグのサイズ:フラグアイコンのサイズを調整します。
  • 言語名ホバーカラー: ユーザーが言語名にカーソルを合わせたときに表示されるテキストの色を定義する。
  • ポップアップ言語ホバーカラー: ユーザーがポップアップまたはドロップダウン領域の言語タイトルにマウスオーバーしたときに表示されるテキストの色を指定します。
カスタマイズ可能なオプションが空の設定メニュー

ステップ9:フラグのボックスシャドウを設定する

最後に、フラグボックスのシャドウ設定を調整できます。最初のオプションでは、Webサイトに表示される各フラグアイコンにシャドウ効果を追加できます。2番目のオプションは、ユーザーが言語フラグにマウスオーバーしたときのシャドウ効果を制御します。.

 

必要な調整を行ったら、保存ボタンをクリックしてカスタマイズの変更を適用します。次に、Magentoウェブサイトに移動して、構成が正常に適用されたことを確認します。これにより、言語切り替えの表示方法がわかります。

カスタマイズ用の設定とボタンが表示された黒い画面。.

設定を完了すると、 Magento 多言語ウェブサイトで言語スイッチャーを見ることができます。.

黒と白の4つの製品画像。さまざまな製品が表示されている。.

Magento ウェブサイトをスペイン語などの他の言語に自動翻訳します。.

人物やアートのモノクロ写真。さまざまな撮影スタイル。.

Magentoの言語切り替えを強化する4つの戦略

多言語ウェブサイトに言語切り替え機能を設定したら、Magento言語セレクターの最適なデザイン戦略とパフォーマンスの最適化を把握し、サイトとユーザーエクスペリエンスを向上させる必要があります。

簡単に言語インジケーターを実装

大きなモニターの周りで協力して作業する人々。チームコラボレーションのコンセプト。.

言語スイッチャーで世界共通に認識されている言語記号または旗を使用することは非常に重要です。これにより、訪問者は自分の好みの言語を素早く見つけて選択することができます。馴染みのある記号を使用することで、直感的なユーザーエクスペリエンスが生まれ、訪問者は自分の希望する言語バージョンにスムーズに移動できます。重要なのは、誤解を避けるために世界中で認識されている指標を選択することです。.

たとえば、多言語のeコマースサイトでは、スポーツ用品を販売しています。言語スイッチャーでは、国旗と言語の略称を組み合わせて使用できます。

  • EN(英語の場合)
  • ES(スペイン語の場合)
  • FR(フランス語の場合)
  • DE(ドイツ語の場合)
  • JP(日本語の場合)

このアプローチは、視覚的な手がかり(フラグ)とテキスト(言語コード)を組み合わせることで、異なる背景を持つユーザーが好みの言語を簡単に識別できるようにします。フラグは即座に認識可能で、略称は追加の明確さを提供します。. 

たとえば、スペイン語を話す訪問者は、スペインの旗と「ES」の略称をすばやく見つけて、1クリックでサイトをスペイン語に切り替えることができます。このユーザーフレンドリーな設計により、全体的なブラウジング体験が向上し、サイトでのエンゲージメントとコンバージョンが増加する可能性があります。.

Combine language names and flags

ショッピングモールの詳細なフロアプラン

フラグは視覚的に魅力的ですが、言語のネイティブ名と組み合わせることが有益です。この戦略は、特に複数の国で異なるフラグが使用されている言語で混乱を防ぐのに役立ちます。.

実際の言語名を使用することで曖昧さがなくなり、訪問者が自分の好みの言語を正確に識別して選択できるようになります。さらに、このアプローチは多様性を尊重し、包括性を促進します。.

例えば、世界中の多様なオーディエンスに対応するグローバルニュースウェブサイト。彼らの言語切り替えはこうなるかもしれない。.

言語オプションリスト

この場合:

  1. フラグの使用は迅速な視覚的手がかりを提供する。.
  2. 言語名はネイティブスクリプトで記述されています(日本語、フランス語など)。その言語の話者にはすぐに認識できます。.

このアプローチは、スペイン語や英語など、複数の国で話されている言語に特に有効です。たとえば、メキシコやアルゼンチンのユーザーは、複数のスペイン語圏の国旗から選択するのではなく、「Español」と表示されます。同様に、英国、米国、オーストラリア、その他の英語圏のユーザーは、使用されている国旗に関係なく、「English」で識別できます。.

言語スイッチャーを戦略的に配置する

コンピューター画面のダイアグラムの白黒画像。コンピューターインターフェイスの技術的なイラスト。.

言語スイッチャーをウェブサイト上の目立つ、アクセスしやすい場所に配置することが重要です。一般的で効果的な位置には、ヘッダー、フッター、またはメインのナビゲーションメニューがあります。これらのスポットは、ほとんどのウェブユーザーにとって直感的であり、言語オプションを探す際の期待に沿ったものです。.

すべてのページで一貫した配置を維持することで、訪問者はエントリーポイントや現在のページに関係なく、言語切り替えに容易にアクセスできます。この一貫性は、スムーズで予測可能なユーザーエクスペリエンスに貢献します。.

たとえば、国際ホテル予約サイトがグローバルなオーディエンスに対応する場合、以下のように言語スイッチャー戦略を実装できます。.

  1. ヘッダー配置:
  2. 一貫したデザイン: 言語切り替えは、地球のアイコンに続いて現在の言語(例: 「🌐 English」)として表示されます。クリックすると、他の言語オプションを含むドロップダウンメニューが開きます。
  3. フッターのバックアップ: フッターには、利用可能なすべての言語のテキストベースのリストが含まれており、代替のアクセスポイントを提供します。

この戦略的な配置により、ユーザーがホームページ、特定のホテルページ、または予約確認ページのいずれにアクセスしても、言語切り替え機能を簡単に見つけて使用できるようになります。たとえば、東京のホテルを閲覧しているフランス人ユーザーは、サイトをフランス語にすばやく切り替えて、部屋の説明や予約条件をより簡単に理解し、ユーザーエクスペリエンスを向上させ、予約完了の可能性を高めることができます。.

すべてのページで言語スイッチャーの一貫性を維持する

ファッションウェブサイトのレスポンシブデザイン

言語スイッチャーがウェブサイト全体で一貫した外観と機能を維持することが重要です。ユーザーは、現在のページや閲覧中のコンテンツに関係なく、簡単に言語を変更できる必要があります。この一貫性により、シームレスなユーザーエクスペリエンスが提供され、言語オプションのアクセシビリティが強化され、多言語ウェブサイトへの信頼と自信が育まれます。.

たとえば、電子機器を販売するグローバルなEコマースプラットフォームの場合、一貫した言語切り替え戦略をどのように実装するかを検討します。.

  1. 統一されたデザイン: 言語切り替えは地球のアイコンと現在の言語コード(例: “🌐 EN”)で表示され、商品リスト、個々の商品ページ、ショッピングカート、チェックアウトページを含むすべてのページの右上隅に表示される。
  2. 一貫した機能: 言語スイッチャーをクリックすると、ページに関係なく、常に同じドロップダウンメニューが表示され、利用可能なすべての言語が表示されます。
  3. コンテンツの保持: ユーザーが言語を切り替えると、同じページに留まりますが、コンテンツは新しく選択された言語で表示されます。たとえば、ユーザーが英語でノートパソコンの仕様を表示していてスペイン語に切り替えると、同じノートパソコンの詳細がスペイン語で表示されます。.
  4. URL 構造: URL構造は言語を切り替えると一貫して変化する。例えば:

ケーススタディ: 英語版のサイトでノートパソコンを閲覧している日本人顧客が、より理解を深めるために日本語に切り替えることを決定します。彼らはヘッダーの「🌐 EN」アイコンをクリックし、ドロップダウンから「日本語」を選択すると、ページが更新され、同じノートパソコンの詳細が日本語で表示されます。URL は「/products/…」から「/ja/製品/…」に変更されます。

この一貫したエクスペリエンスにより、ユーザーは自信を持って自分の好みの言語でサイトを閲覧し、購入を完了する可能性を高め、将来サイトに戻ってくる可能性も高まります。.

新しい市場を開拓する準備はできていますか? 1ヶ月のリスクフリー試用で無料で自動翻訳サービスをお試しください。クレジットカードは不要です!

Magento で言語切り替えを設定する Linguise!

これで、あなたは多言語対応の Magento ウェブサイト用の言語切り替えを設定していることを理解しているはずです。言語切り替えを実装すると、多くの利点が得られ、私たちのガイドラインに従ってカスタマイズできます。.

言語切り替えを最適化することで、Magentoサイトでのユーザーエクスペリエンスが大幅に向上します。次のステップは、Linguiseアカウントを作成し、それをMagentoウェブサイトと統合し、言語切り替え設定を微調整することです。これらのアクションにより、ユーザーエクスペリエンスが向上し、多言語のEコマースサイトがよりアクセスしやすく、ユーザーフレンドリーになります。

適切に実装された言語スイッチャーは、 Magento プラットフォームでのエンゲージメントの向上、コンバージョンの増加、さまざまな言語市場での顧客満足度の向上につながります。これは、真に多言語なウェブサイトを作成する上で重要な要素です。.

また、以下の記事にも興味をお持ちかもしれません

お見逃しなく!
ニュースレターを購読する

ウェブサイトの自動翻訳、国際SEOなどの最新情報をご覧いただけます!

Invalid email address
試してみてください。月額1回、いつでも退会できます。.

メールアドレスを共有してからお立ち回りください!

宝くじに当選することを保証することはできませんが、翻訳に関する興味深い情報や時折割引情報をお約束します。.

お見逃しなく!
Invalid email address