ウィジェットのデフォルト言語を英語に変更する方法

JTB BÓKUNのウィジェット（予約エンジン）は、30以上の言語に対応しています。多言語で商品を販売する際の言語設定について説明します。

前段の準備として、まずは作成した商品に多言語の翻訳を追加する必要があります。追加方法はこちらをご参照ください。

ウィジェットのデフォルト言語を指定言語に変更する方法

1．左側のメインメニュー＞設定＞販売関連＞予約チャンネルをクリックします。

2．デフォルト言語を設定したい予約チャンネルの編集をクリックします。

 

3．左側のメニューの「デフォルトの言語」をクリックし、ドロップダウンから当該予約チャンネルで販売する際のデフォルト言語を選択し、「続ける」をクリックします。

 

これで、予約チャンネル設定で、ウィジェットのデフォルト言語の変更が完了となります。必ず、該当予約チャンネルでウィジェットを生成し、設定内容が反映されているかどうかを確認してください。

ウィジェット表記する言語について：うまく反映されない場合

上記のステップに従って設定したにもかかわらず、予約チャンネルで指定した言語でウィジェットがデフォルトで表示されなかった場合は、ウィジェットの言語表示の適用優先順位が原因です。

ウィジェットの言語表示の適用優先順位は以下の通り：

1. ウィジェットコードの上書き
2. ウェブサイトのHTMLの指定言語
3. 予約チャンネルで設定したデフォルト言語

下記では、ウィジェットコードの上書きする方法とウェブサイトのHTML指定言語の確認方法についてそれぞれ説明します。

ウィジェットコードを上書きする方法

ウィジェットコードのdata-src部分に言語指定のパラメータ?lang=言語コードを追加することで、ウィジェットの表示言語を強制的に指定することができます。

商品ページタイプのウィジェットコードサンプル（該当箇所の一部のみ）

<div class="bokun-widgets" data-src="https://widgets.bokun.io/online-sales/:BOOKING_CHANNEL_UUID/experience-calendar/:EXPERIENCE_ID?lang=en"></div>

予約ボタンタイプのウィジェットコードサンプル（該当箇所の一部のみ）：

<button class="bokunButton" disabled id=bokun_896d88c8_f7d3_4af1_afd2_29304fed5e19 data-src="https://widgets.bokun.io/online-sales/f22582dd-68de-4395-8f66-xxxxxxxxxxxx/experience/651526?lang=en&?partialView=1" data-testid="widget-book-button" > Book now </button>

ウェブサイトのHTMLの指定言語の確認方法

もしウィジェットコードの埋め込み先のウェブサイトで、タブにてある言語を指定している場合、ウィジェット表示言語がタブが指定した言語に従います。

タブのサンプル：
下記のウェブサイトに、英語がデフォルト言語として設定した予約チャンネルのウィジェットコードを埋め込んでも、日本語で表示されます。

 

ベンダー向けのJavaScript機能

以下の内容は開発ベンダー向けの内容です。
もし自社ウェブサイトの言語切替ボタン/ドロップダウンリストに合わせて、ウィジェット言語を変更したい場合は、以下のJavaScriptをウェブサイトに追加することでできます。

function onLanguageChange(newLanguage) {
    // Just to make sure that BokunWidgets has loaded.
    if (BokunWidgets) {
      BokunWidgets.setLanguage(newLanguage);
    }
  }

 

サポート言語コード一覧