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

学生がいるEラーニングのウェブサイトのスクリーンショット
目次

Concrete CMS で作成したウェブサイトをお持ちで、言語スイッチャーを追加したいですか?言語スイッチャーを設定すると、ユーザーが言語を切り替えるプロセスが簡素化されます。この機能は、国際的なユーザーベースを持つウェブサイトに特に便利で、訪問者が好みの言語でプラットフォームをナビゲートできるようになります。.

Concrete CMS自動翻訳サービスの1つを使用して、Concrete CMS

Concrete CMSで言語切り替えを設定することの重要性

様々なデザイン要素が表示された大きなコンピューター画面で作業する一団の人々。.

複数の言語でコンテンツを提供する必要性はますます重要になっています。DeepLの最近の調査によると、75%の回答者が、ローカライズされたコンテンツが顧客エンゲージメントを大幅に増加させることに同意しています。

言語スイッチャーを実装することは、コンテンツを翻訳し、ウェブサイト訪問者にとってよりパーソナライズされた体験を作成することです。これは、コンテンツのローカライゼーションの取り組みから96%の回答者が投資収益率(ROI)を観察したというデータから明らかです。. 

これらのデータを念頭に置いて、 Concrete CMS に言語切り替えを実装することは、放棄できない戦略的な動きです。そのため、この記事では、 Concrete CMS のWebサイトで言語切り替えを設定する方法について説明します。.

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

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

多言語 Concrete CMS プラットフォームでの言語変更機能の重要性を理解したので、それを実装する方法について説明します。 Concrete CMS には、組織のニーズに合わせてカスタマイズできる組み込みの言語管理システムがあります。.

使用できる自動翻訳サービスの一つはLinguiseです。Linguiseは、簡単に使用できる言語切り替え機能を提供し、様々な人気CMSと統合できます。Concrete CMS

Concrete CMSは、簡単に多言語対応ができ、管理者が言語切り替え機能をサイトに素早く追加できるようにします。 Concrete CMSの高度な機能とユーザーフレンドリーなインターフェースを活用することで、プラットフォーム上の言語切り替えの設定と維持を簡単にできます。以下は、インストール手順Linguise自動翻訳をConcrete CMSに設定し、言語切り替えを設定する手順です。

#1 Concrete CMS ドメインを登録する

まず、無料の Linguise アカウントを作成し、ウェブサイトのドメインを追加します。サブスクリプションを決定する前に、30日間の無料トライアルを使用できます。.

プラットフォームユーザーインターフェイスのスクリーンショット

次に、翻訳のためにドメインを認証する必要があります。「https://」を含むドメイン名をコピーし、「Concrete CMS」をプラットフォームとして選択します。元の言語と、 Concrete CMS内で自動翻訳を設定するターゲット言語を選択します。.

翻訳言語設定ページのスクリーンショット。このページでは、ユーザーが翻訳する言語を選択できます。.

#2: Linguise スクリプトをアップロードして接続する

Linguise 翻訳スクリプトを、 Concrete CMS がインストールされているサーバーにアップロードする必要があります。提供されたリンクからスクリプトをダウンロードし、解凍してフォルダーを Concrete CMS インストールのルートディレクトリに配置します。フォルダーが「linguise」と命名されていることを確認してください。

ファイルシステムディレクトリ一覧

次に、 Linguise APIキーをサーバーのConfiguration.phpファイルに挿入します。ファイルを 開き、「REPLACE_BY_YOUR_TOKEN」をシングルクォーテーション内のAPIキーに置き換えます。.

Javaクラス設定を示すコードスニペット

#3: Concrete CMS URL書き換えの設定

Concrete CMSでは、URL書き換えは通常デフォルトで有効になっています。そうでない場合は、ホスティングプロバイダーを通じて有効にできます。“.htaccess”ファイルの“RewriteEngine on”行の後に特定のコードを追加して更新します。これにより、言語固有のURLが設定されます。.

				
					<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)(?:$|/)(.*)$ /concretee/linguise/linguise.php?linguise_language=$1&original_url=$2 [L,QSA]
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME}/index.html !-f
    RewriteCond %{REQUEST_FILENAME}/index.php !-f
    RewriteRule . /concretee/index.php [L]
</IfModule>
				
			

#4: 言語スイッチャーの有効化とカスタマイズ

Linguise JSスクリプトリンクは、すべての Concrete CMS ページで読み込まれる必要があります。言語スイッチャーをフラグと代替URL(SEOに重要)で表示するためです。スクリプトリンクは、 Linguise ダッシュボードのドメイン設定で確認できます。.

コードをクリップボードにコピー

Concrete CMSでスクリプトをロードするには、header.phpファイルにコードを挿入するか、または管理パネルを通じてサイトの<head>セクションにSystem & Settings > SEO & Statisticsに移動してコードを挿入します。.

システムと設定メニューのスクリーンショット

次に、トラッキングコードの下に追加します。. 

トラッキングコードを管理するための設定ページ

デフォルトでは、スイッチャーは右上に表示されます。.

Atomik Agencyのウェブサイトホームページと言語オプション

ただし、ダッシュボードの外観は「言語フラグ表示」機能を使用してカスタマイズできます。.

#5: メインディスプレイの設定

言語切り替えの設定を開始するには、“設定” > “言語フラグの表示” セクションに移動します。Linguise ダッシュボードで、いくつかの設定を調整できます。

  • 国旗アイコンのスタイル: 横並び、ドロップダウンメニュー、ポップアップの3つの表示スタイルから選択します。
  • 位置: 言語切り替えの位置をWebサイト上で選択し、訪問者が簡単にアクセスできるようにします。
言語リスト表示をカスタマイズするための設定パネル

#6: フラグのデザインをカスタマイズする

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

  • 言語名の表示: 国または言語に基づいて名前を表示するかどうかを決定します(例:「フランス語」または「Français」)。
  • 英語のフラグの種類: このオプションを使用すると、米国の英語またはイギリスの英語のバリエーションを区別し、スペイン語、ポルトガル語、またはドイツ語にも同様に適用できます。
  • フラグスタイル: フラグアイコンの形状を丸または長方形から選択します。
国旗と言語設定

#7: 色とサイズを調整する

次に、フラグの色とサイズをカスタマイズできます。.

  • フラグの角丸: 長方形のフラグの半径をピクセル単位で設定します。
  • 言語名の色: 言語名を表示するためのデフォルトのテキスト色を選択します。
  • ポップアップ言語の色: ポップアップまたはドロップダウンで言語タイトルに表示するテキストの色を指定します。
  • フラグサイズ: フラグアイコンのサイズを調整します。
  • 言語名のホバー色: 言語名のホバー色を設定します。
  • ポップアップ言語ホバーカラー: ポップアップまたはドロップダウンの言語タイトルのホバーカラーを定義します。
国旗と言語設定

#8: フラグのボックスシャドウを追加

最後に、フラグボックスのシャドウ設定をカスタマイズできます。.

  • 最初のオプションは、ウェブサイトに表示されるフラグアイコンにシャドウ効果を追加します。.
  • 2番目のオプションは、ユーザーが言語フラグにカーソルを合わせたときのシャドウ効果を制御します。.
フラグボックスシャドウ設定とカスタマイズオプション

設定に満足したら、“保存” をクリックして変更を適用します。Concrete CMS Webサイトにアクセスして、言語切り替えが期待どおりに機能していることを確認し、その外観をプレビューします。

多言語ウェブサイトインターフェイスと言語オプション

サイトをドイツ語などの追加言語に翻訳することもできます。.

コンピューター画面上のウェブサイトのスクリーンショット。.

Concrete CMSでの言語スイッチャーを最適化するためのベストプラクティス

Concrete CMS の言語スイッチャーを最適化すると、多言語環境でのユーザーエクスペリエンスが向上します。以下は、プラットフォーム上の言語スイッチャーを改善するための重要なヒントです。.

言語名とフラグの使用

人々とデジタルインターフェースコンポーネントのイラスト。さまざまなカラフルな要素。.

言語名と国旗アイコンを組み合わせることは、言語スイッチャーをよりユーザーフレンドリーにする効果的な方法です。このアプローチは2つの視覚的なヒントを提供し、ユーザーが選択した言語を迅速に識別して選択するのに役立ちます。言語名は明確さを提供し、国旗は視覚的な参照を提供するため、特に複数の国で異なる国旗が使用されている言語の場合、ユーザーが選択しやすくなります。.

たとえば、 Concrete CMS サイトがグローバルなEコマースのユーザー層を対象としている場合、「🇺🇸 English」「🇫🇷 Français」「🇩🇪 Deutsch」を言語スイッチャーで組み合わせることで、ユーザーが好みの言語を素早く見つけやすくなり、ショッピング体験が向上し、サイト内をスムーズに閲覧できるようになります。.

認識可能な国旗アイコン

フランス、スペイン、ドイツの旗を持つ2人がコンピューターで作業しています。彼らは翻訳プロジェクトで協力しています。.

明確で高品質な国旗アイコンを使用することが重要です。小さいサイズでも簡単に認識できるため、ユーザーがテキストを読まなくても言語を素早く識別するのに役立ちます。必要に応じて、国の旗ではなく言語を表す文化的に敏感なアイコンを選択することが重要です。たとえば、広く話されている言語であるアラビア語の場合、国旗を選択するよりも中立的な記号を使用する方が適切です。.

たとえば、世界的な旅行代理店向けに設計された Concrete CMS プラットフォームでは、スペイン語にはスペインの旗、フランス語にはカナダの旗、広く話されている言語(英語など)には地球のアイコンを使用します。これにより、アイコンが明確で直感的になり、ユーザーが旅行パッケージを閲覧しながら簡単に言語を選択できるようになります。.

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

ノートパソコンで大きなブラウザを操作する男性.

言語スイッチャーは、インターフェイスを乱雑にすることなく、ユーザーにとって見やすくアクセスしやすい場所に配置する必要があります。一般的な配置オプションには、サイトのヘッダー、フッター、またはメインのナビゲーションメニューがあります。すべてのページで配置の一貫性を保つことが重要であり、ユーザーはサイト上のどこでもそれを見つけることができます。.

たとえば、 Concrete CMS サイトの場合、ヘッダーの右上隅にスイッチャーを配置し、ユーザーがページをスクロールしても表示されたままになるようにします。モバイルの場合は、ハンバーガーメニューに統合してアクセシビリティを維持しながらスペースを節約します。.

ページ間で一貫性を維持する

デスクトップ、タブレット、モバイルでのWeb会議プラットフォーム

外観と機能の一貫性を保つことが重要です。言語切り替えボタンはすべてのページで同じように動作し、ユーザーが言語を切り替えたときに、コンテンツが新しい言語に翻訳された同じページにとどまる必要があります。これにより、ユーザーのワークフローが向上し、ナビゲーションがより直感的になります。.

たとえば、ドロップダウン言語切り替えボタンは、ホームページ、連絡先ページなど、すべてのページで一貫して表示されます。これにより、ユーザーは素材内の現在位置を失うことなく、シームレスに言語を変更できます。.

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

結論

多言語 Concrete CMS 翻訳ソリューション。ウェブサイトの自動翻訳。.

言語スイッチャーを設定し、ウェブサイト上で自動翻訳を実装するConcrete CMSと、ユーザーの多言語対応体験をスムーズに提供できます。本ガイドで概説されている手順に従って、言語スイッチャーを統合し、サイトのニーズに合わせてカスタマイズできます。

言語スイッチャーを効果的に最適化することで、ユーザーエクスペリエンスとエンゲージメントが向上します。まず、LinguiseアカウントにサインアップConcrete CMSサイトと統合

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

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

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

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

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

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

お見逃しなく!
Invalid email address