ヘルプ記事

MultiLipiにおけるフローティングと埋め込み言語スイッチャーについて

MultiLipi
MultiLipi•2025年9月15日•
5分 読む
ブログカバー画像

「言語スイッチャー」は、ローカライズされたインフラストラクチャへのユーザーの架け橋です。MultiLipiは、デプロイの容易さとデザインの整合性のバランスをとるために、2つの異なるインジェクション方法をサポートしています。永続的なフローティングオーバーレイ(迅速なローンチに最適)として、または深く統合された埋め込み要素(カスタムデザインに最適)としてデプロイできます。

このガイドでは、両方の戦略間のナビゲーション手順と技術的な違いについて詳しく説明します。

1. 設定プロトコル (ナビゲーション)

インターフェイスコントロールにアクセスする。

位置戦略を設定するには、コマンドセンターでこのパスに従ってください:

ステップ 1: ダッシュボードにアクセス
MultiLipi アカウントにログインしてホームビューにアクセスします。

ステップ 2: プロジェクトの選択
設定したいウェブサイトの特定のプロジェクトタイルをクリックします。

ステップ3: 設定にアクセス
左側のサイドバーで、設定をクリックします。

ステップ4: モジュールを検索
サブメニューまたは設定リストから言語スイッチャーを選択します。

アクション:

Floating モードと Embedded モードを切り替えるオプションが表示されます。

MultiLipi言語スイッチャーの設定インターフェイス。表示オプションのサイドバーが表示され、ポジショニングとレイアウトセクションが赤でハイライトされ、埋め込み位置トグル、HTML body>nav>ul (#header) の例を含むターゲット親フィールド、およびターゲット兄弟フィールドが含まれています。

2. フローティングスイッチャー (オーバーレイモード)

JSインジェクションによる迅速なデプロイ。

それは何ですか?

Floating スイッチャーは、JavaScript を介して DOM に注入される自律ウィジェットです。ウェブサイトのコンテンツの上に Z軸に配置され、ビューポートの隅に固定されます。

配置: 4つの象限のいずれかに設定可能:

  • •左下(デフォルト)/ 右下
  • •左上 / 右上

アーキテクチャ上の利点:

  • •ゼロコード: HTML編集は不要です。スクリプトインジェクションですぐに機能します。
  • •ユニバーサル互換性: レイアウトフローを壊すことなく、あらゆるプラットフォーム(WordPress、Shopify、Webflow)でレンダリングが保証されます。
  • •モバイル対応: 小さなビューポートに合わせて自動的にスケールおよび再配置されます。

最適: フロントエンド開発者を関与させることなく、「プラグアンドプレイ」ソリューションを必要とするチーム。

3. 埋め込みスイッチャー(統合モード)

シームレスなDOM挿入。

それは何ですか?

埋め込みスイッチャーを使用すると、ナビゲーションバー (<nav>) やフッターなど、HTML構造内の特定のコンテナに言語切り替え機能を直接挿入できます。

仕組み: MultiLipiダッシュボードで特定のCSSセレクター(IDまたはクラス)を指定します。

入力例: #menu-language-item または .navbar-right。

アクション: スクリプトは DOM をスキャンしてその特定のセレクターを探し、親のレイアウト制約を継承してその要素内にスイッチャーをレンダリングします。

最適: ピクセルパーフェクトなコントロールを必要とし、スイッチャーをUIメニューシステムのネイティブな一部のように感じさせたいデザイナー。

4. フェイルオーバープロトコル (安全ロジック)

インターフェースの可用性を確保します。

動的なウェブ環境では、ID やクラスは変更される可能性があります。埋め込みスイッチャーが #nav-lang をターゲットにしているのに、開発者が誤ってその ID を #nav-menu に変更した場合はどうなりますか?

MultiLipiは自動フェイルオーバーを実行します:

  • •スキャン: スクリプトはターゲットのCSSセレクターを見つけようとします。
  • •失敗: ターゲットが見つからない(null)場合、スクリプトはエラーをフラグ付けします。
  • •復旧: 自動的にフローティングモードに戻ります。
  • •結果: スイッチャーはデフォルトのフローティング位置(例:右下)に表示され、レイアウトが壊れていてもユーザーは言語を変更できます。
  • •デバッグ: 開発者が修正できるように、コンソールに警告が記録されます。

この記事は役に立ちましたか?

この記事では

共有

グローバル展開の準備はできましたか?

MultiLipiがコンテンツ戦略をどのように変革し、AI搭載の多言語最適化でグローバルなオーディエンスにリーチできるようになるか、ぜひご相談ください。

フォームにご記入いただければ、24時間以内に担当チームよりご連絡いたします。