Magentoで言語切り替え機能を設定する方法

 Magentoのサマーセール終了、期間限定オファー
Table of Contents

言語切り替え機能の設定 は Magento において不可欠です。この機能は国際的なオーディエンスを対象とするウェブサイトにとって極めて重要であり、現在の市場では言語を簡単に切り替えられる能力が急務となっています。

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

Magentoの言語スイッチャーを設定すべき理由

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

Magento用の言語切り替え機能を設定すべき4つの重要な理由は以下の通りです。.

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

これらの機能を実装することで、 Magento ストアは多様なグローバルオーディエンスにとってよりアクセスしやすく使いやすくなり、 ウェブトラフィック、エンゲージメント、売上の増加につながる可能性があります。

Magentoで言語切り替えを設定する方法は?

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

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

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

を活用することで、 Linguiseの Magento CMSとのスムーズな統合により、言語切り替え機能を 多言語ウェブサイトに 簡単に組み込むことができます。 Linguise の機能と直感的なインターフェースにより、 Magento ウェブサイトでの言語切り替え機能の設定と維持が大幅に簡単になります。次のセクションでは、多言語 Linguiseをインストール Linguise し、 Magento ウェブサイトに 言語切り替え機能を設定する手順を説明します。

言語の壁を突破する
言語の壁に別れを告げ、無限の成長を手に入れましょう!今すぐ自動翻訳サービスをお試しください。.

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

まず、 Linguise アカウントに無料で登録 して、1か月間のトライアル期間をご利用ください。登録手続きは簡単です–メールアドレスを入力するだけでログイン情報を作成できます。

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

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

Linguiseアカウントの作成が完了すると、 Linguise ダッシュボードにリダイレクトされます。そこで、 ウェブサイトのドメイン 情報を追加する必要があります。 「ドメインを追加」 オプションを探してクリックしてください。すると、入力すべき複数のフィールドを含むフォームが表示されます:

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

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

暗い画像で、かすかなテキストと線が見えます。この画像は、ウェブページまたはドキュメントのスクリーンショットのようです。.
薄いグレーのテキストと線が入った暗い画像。この画像は低解像度のスクリーンショットのようです。.

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

翻訳ツールが表示されたYouTube動画のスクリーンショット画像

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

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

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

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

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

続いて、先ほどアップロードしたConfiguration.phpファイルに Linguise のAPIキーを組み込む必要があります。このファイルを開いて編集し、プレースホルダーテキスト「REPLACE_BY_YOUR_TOKEN」を見つけて、引用符で囲まれたまま実際のAPIキーに置き換えてください。.

構文ハイライト付きのコードスニペット。.

ステップ4: MagentoのURLリライティングを設定する

あなたの Magento 管理パネルにアクセスし、サイドバーメニューからこのパスをたどってください:  ストア > 設定 > 構成 > 一般 > Web > 検索エンジン最適化

そこに移動したら、「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:言語切り替えを有効化&カスタマイズ

言語スイッチャーは、ユーザーが希望の言語を選択できるフラグポップアップです。読み込むには、ウェブサイト構成の最後に提供されているコードをコピーし、HTML ページの head に配置します。すると、フラグ言語スイッチャーが自動的に読み込まれます。.

ウェブサイトのヘッダーにコピーして読み込むコードは、 Linguise ダッシュボードの「Your Domain > Settings > Tab > Script PHP」に移動すると確認できます。

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

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

デザイン設定表のスクリーンショット

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

黒い画面に白いテキストと右側に灰色の円。テキストはエラーメッセージのようです。.

言語切り替えボタンは、最初はウェブサイトの右下にフローティング表示されます。外観と配置は、 Linguise ダッシュボード > 設定 > 言語フラグ表示

ステップ6:メインディスプレイを設定する

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

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

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

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

  • 言語名の表示: 国名または言語自体に基づいて言語名を表示するか選択できます。例えば「French」や「Français」などです。
  • 英語の国旗タイプ: これは、アメリカ英語やイギリス英語、スペイン語、台湾語、ドイツ語、ポルトガル語など、複数のバリエーションがある言語に便利です。
  • 旗のスタイル: 旗アイコンの形状を丸型または長方形から選択します。
さまざまなフラグの種類と言語を示すスクリーンショット。.

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

国旗のデザインを確定した後、以下の設定で国旗の色とサイズをカスタマイズできます:

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

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

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

 

必要な調整をすべて行ったら、 保存 ボタンをクリックしてカスタマイズ変更を適用します。その後、 Magento のウェブサイトに移動して、設定が正常に適用されたことを確認してください。これにより、言語切り替えがどのように表示されるかを把握できます。

カスタマイズ用の設定とボタンがある黒い画面。.

セットアップが完了すると、 Magento 多言語ウェブサイトに言語切り替えスイッチャーが表示されます。.

白黒の商品画像4点。さまざまな商品が表示されています。.

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

人物やアートの白黒写真。さまざまな写真スタイル。.

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

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

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

大きなモニターを囲んで協力し合う人々。チームコラボレーションのコンセプト。.

言語切り替え機能には、世界的に認知された言語記号や国旗を使用することが極めて重要です。これにより、訪問者は素早く自分の好みの言語を見つけて選択できます。馴染みのある記号を採用することで直感的なユーザー体験が生まれ、訪問者は目的の言語版へ容易に移動できます。誤解を防ぐために、世界的に認知された指標を選ぶことが鍵となります。.

たとえば、 多言語対応のEコマースサイト がスポーツ用品を販売しているとします。その言語切り替え機能では、国旗と言語の略称を組み合わせて使用できます:

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

このアプローチでは、視覚的な手がかり(国旗)とテキスト(言語コード)を組み合わせることで、さまざまな背景を持つユーザーが自分の好みの言語を簡単に識別できるようになります。国旗はすぐに認識でき、略称はさらなる明確さを提供します。. 

たとえば、スペイン語を話す訪問者はスペインの国旗と「ES」の略称をすぐに見つけることができ、ワンクリックでサイトをスペイン語に切り替えられます。このユーザーフレンドリーなデザインは、全体的なブラウジング体験を向上させ、サイトのエンゲージメントとコンバージョンを高める可能性があります。.

言語名と旗を組み合わせる

ショッピングモールの詳細な間取り図

国旗は視覚的に魅力的ですが、言語のネイティブ名と組み合わせることが効果的です。この戦略は、特に一部の言語が異なる国旗を持つ複数の国で使用されているため、混乱を防ぐのに役立ちます。.

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

たとえば、多様な視聴者に対応するグローバルニュースウェブサイト。その言語切り替えはこのようになるかもしれません。.

言語オプションリスト

この場合:

  1. 国旗を使用することで、素早い視覚的な手がかりが得られます。.
  2. 言語名は母国語のスクリプト(日本語、フランス語など)で表記されるため、その言語の話者にはすぐに認識できます。.

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

言語切り替えを戦略的に配置する

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

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

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

例えば、世界中の顧客に対応する国際的なホテル予約ウェブサイトを考えてみましょう。彼らは言語切り替え戦略を次のように実装できます。.

  1. ヘッダーへの配置: 言語切り替え機能は、ヘッダーの右上隅、ユーザーアカウントアイコンと通貨セレクターの隣に配置されています。どのページでも表示され、閲覧中や予約プロセスの途中でもいつでも言語を切り替えることができます。
  2. 一貫性のあるデザイン: 言語切り替えボタンは、地球儀アイコンの後に現在の言語(例:「🌐 英語」)が表示されます。クリックすると、他の言語オプションを含むドロップダウンメニューが開きます。
  3. フッターのバックアップ: フッターには利用可能なすべての言語のテキストベースのリストが含まれており、代替のアクセスポイントを提供します。

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

すべてのページで言語切り替えの一貫性を保つ

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

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

例えば、電子機器を販売するグローバルなeコマースプラットフォームを考えてみましょう。一貫した言語切り替え戦略をどのように実装するかの例を以下に示します。.

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

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

サイトのすべてのページと機能で一貫した体験を提供することで、ユーザーは好みの言語で自信を持って操作し、買い物をすることができ、購入を完了して将来再びサイトに戻る可能性が高まるでしょう。.

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

Magento で Linguiseの言語切り替えを設定しましょう!

これまでに、多言語 Magento ウェブサイト用の言語切り替えを設定していることをご理解いただけたでしょう。言語切り替えを実装することで多くのメリットが得られ、当社のガイドラインに従ってカスタマイズできます。.

言語スイッチャーを最適化することで、 Magento サイト全体のユーザーエクスペリエンスを大幅に向上させることができます。次のステップは、 Linguise アカウントを作成し、 Magento ウェブサイトと連携させ、言語スイッチャーの設定を微調整することです。これらの操作によりユーザーエクスペリエンスが向上し、多言語eコマースサイトがよりアクセスしやすく、使いやすくなります。

Magentoプラットフォームに適切に実装された言語切り替え機能は、エンゲージメントの向上、コンバージョンの増加、そして多言語市場における顧客満足度の向上につながることを忘れないでください。これは、真に多言語対応のウェブサイトを作成する上で不可欠な要素です。.

こちらもお読みになることをお勧めします

Don't miss out!
Subscribe to our Newsletter

ウェブサイトの自動翻訳、国際SEOなどに関するニュースを受け取りましょう!

Invalid email address
ぜひお試しください。月に1回の配信で、いつでも配信停止できます。.

メールアドレスを共有せずに離脱しないでください!

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

Don't miss out!
Invalid email address