Language 日本語
  • tripla 管理画面ヘルプページ
  • 新機能追加のご案内
  • お知らせ
    • 『tripla Pay』 決済手数料変更のお知らせ
    • 『tripla Pay 』 新決済条件のご案内
    • 過去のお知らせ
  • 弊社へのお問い合わせについて
    • 弊社へのお問い合わせについて
    • 今後のサポート窓口に関するご案内
      • web_form
    • Q&A
  • カテゴリーから探す
    • プラン
    • 予約
    • データ出力
    • 設定
    • お客様情報
    • チャットボット
    • 請求書・口座振替書・支払書
    • Google Analytics
  • 動画マニュアル
    • 動画で見るマニュアル チャットボット
    • 動画で見るマニュアル ブッキングエンジン
    • オンラインセミナー動画 ブッキングエンジン
    • オンラインセミナー動画 チャットボット
  • 施設
    • 施設・ブランドへ戻る
  • ダッシュボード
    • tripla Book ダッシュボード(ブランド管理画面)
    • tripla Connect ダッシュボード(ブランド管理画面)
    • tripla Book ダッシュボード(施設管理画面)
    • tripla Analytics ダッシュボード(ブランド管理画面)
    • tripla Analytics ダッシュボード(施設管理画面)
    • tripla Analytics Dashboard(Brand-Level)_English ver.
    • tripla Analytics Dashboard(Facility-Level)_English ver.
    • tripla Boost ダッシュボード
    • tripla Bot ダッシュボード(ブランド管理画面)
    • tripla Bot ダッシュボード(施設管理画面)
  • 予約一覧
    • 予約一覧 メニュー
    • 予約一覧の操作方法
    • 予約確認メールの再送信
    • 予約のキャンセル
    • 予約変更処理
    • 予約一覧CSVダウンロード
    • 予約の注意メッセージの削除
  • リクエスト
    • リクエスト
  • 在庫・価格管理
    • 在庫・価格管理
    • 在庫・価格管理 販売状況・金額の確認
  • チケット
    • サポートチケット
  • チャットボット
    • チャットボット メニュー
    • ボット
    • チャットボット Webhookの設置
    • チャット履歴の確認
    • FAQの回答入力
    • インサイトメール設定
    • 自動メッセージ
    • ブランド単位での自動メッセージ設定方法
    • チャットボット アイコンに関する設定
    • チャットボット「tripla Book」オプションのURLパラメータ
    • 自動メッセージ チャット設定方法
    • チャットボットよくある質問登録
    • チャットボットへの画像挿入
    • チャットボットメニューの設定
    • チャットボット 利用規約
    • 電話からチャットボットへの誘導
    • オペレーターに接続する
    • ウィジェット フォーム作成方法
    • BRRウィジェット
    • チャットボットへのメール回答
    • LINE連携
    • Facebook Messenger連携
    • FAQウィジェット
  • 会員
    • 会員プログラム
    • 会員 アカウントロックの解除
    • 会員 情報の変更・削除
    • 会員 予約・ポイント履歴
    • SNSアカウントでの会員登録・ログイン
    • カスタムアカウントの削除
    • ポイント
    • 組織(法人)ログイン機能の設定
    • 組織CSVダウンロード
    • 登録・ログイン機能設定
  • 予約エンジン設定
    • 施設設定 部屋タイプ
    • 施設設定 プラン
    • プラン管理
    • 検索フィルタ設定
    • 組織(法人) 機能設定
    • 組織(法人) 追加項目
    • プロモーション
    • 利用規約・条件
    • 追加質問・お知らせ設定
      • 追加質問設定
      • お知らせ設定
    • グループ施設への案内機能
    • エリア設定
    • 予約のセキュリティ設定
    • 予約ウィジェットのサブドメイン化
      • サブドメインの設定 ( SSLサーバ証明書ファイルを持っている場合 )
      • サブドメインの設定 ( SSLサーバ証明書ファイルを持っていない場合 )
    • 部屋タイプの追加
    • 新規プランの追加
    • 部屋・プランが反映されない場合(TLリンカーン)
    • プランの詳細変更
    • プラン内容をコピーして新規作成
    • 日帰りプラン
    • プランオプション
    • デフォルト検索条件の設定
    • 通知メール設定
    • カスタムメールテンプレート
    • OTA価格取得・ベストレート設定
    • 子供設定
    • キャンセルポリシー設定
    • 予約変更ポリシー設定
    • オプション販売
    • 宿泊税
    • 予約可能期間の設定
    • 非会員向けのメールの同意
  • レコメンダーウィジェット
  • カスタマーデータプラットフォーム
    • tripla Connect
  • 管理者設定
    • 管理者設定 メニュー
    • カスタムメールドメイン
    • Iframe版tripla Bookの設定
    • 配配メール
    • カスタム認証
    • IPアドレス制限
    • 顧客アプリケーションを登録する
    • ダイナミックパッケージの設定
    • 権限管理
    • ブッキングウィジェット webhookの設定
  • メディア
    • 画像の一括アップロード
  • 設定
    • 施設情報の設定
    • 検索バーの設置
    • ヘッダー/フッター・デザイン設定
    • リンククリックによる予約フロー画面立ち上げ
    • 追加項目の設置
    • 検索結果の表示順位
    • 日付未定検索設定方法
    • カスタムURLの設定
    • ログイン表示設定
    • SNSアカウント利用のログイン(SSO)設定方法
    • GoogleとのSNS連携
    • Yahoo!とのSNS連携
    • 予約ウィジェットURLパラメーター
    • サブドメイン利用時の予約ウィジェットURLパラメーター
    • 利用サービス・システム連携
    • システム連携 TLリンカーン
    • tripla管理画面・TLリンカーンで設定が必要な項目の区分
    • システム連携 手間いらず・ねっぱん・らく通
    • オペレーター設定
    • Outgoing Webhooks
    • ファーストパーティークッキーの設定
    • TableCheck
    • Open AI
    • 管理画面の言語設定
  • tripla pay
    • tripla Pay
  • tripla Guide
  • 人型アイコンでの設定
    • 請求画面の確認
    • 口座振替へ変更・振替口座先変更
    • 未来の宿泊チケット清算
    • tripla Pay 請求確認
    • 管理者側プロフィール設定
    • 権限別作業条件
    • 新規コンシェルジュ追加
  • セットアップ
    • tripla管理画面へのログイン
    • ホテルブッキングサービスについて
    • JavaScriptの設置
    • チャットボットウィジェットの設定
    • コンバージョン計測(第三者タグ)
    • サブドメインのGoogle analytics設定
    • Google Analyticsのコンバージョン設定
    • WIXを使ったホームページ作成
    • WIXでのページ遷移エラー対応方法
    • WIXでのサブドメイン設定
    • Dyspatchを利用したHTMLメール制作
    • 未来の宿泊チケット
    • TripAdvisorアカウント設定方法
    • デジコの設定
    • Google Analyticsの設定
    • 「tripla Book」とGoogleホテル広告の連携
    • GA4設定手順書
      • GA4の測定ID作成方法
  • 旅行予約キャンセル保険
  • 空港直通サービス
  • お客様側での操作
    • お客様画面での予約までの流れ
    • 3Dセキュア
    • お客様画面でのキャンセル
    • 領収書のダウンロード方法
    • お客様への領収書・メールサンプル
    • お客様画面での会員登録
    • お客様画面での会員情報確認・変更
    • お客様画面での宿泊者情報の変更
  • ホームページ設定のご案内(HP制作会社用)
    • ご契約のサービスによって、設定方法が異なります
    • ①「ブッキングエンジン」サービスのみご契約の場合
    • ②「チャットボット」サービスのみご契約の場合
    • ③「ブッキングエンジン」・「チャットボット」サービスをご契約の場合
  • 利用規約
    • tripla Bot サービス利用規約
    • tripla Bookサービス利用規約
    • tripla Boost サービス利用規約
    • tripla Connect サービス利用規約
    • tripla Success サービス利用規約
    • tripla Pay利用規約(宿泊施設向け)
    • tripla Pay利用規約(ユーザー向け)
    • tripla Pay利用規約(ユーザー向け英語版)
    • 宿泊プラン提供規約(ダイナミックパッケージ)
    • DP機能利用規約
    • tripla Page サービス利用規約
    • tripla Link サービス利用規約
    • 利用規約一覧
GitBook提供
このページ内
  • triplaが提供する検索バーの設置方法
  • 検索バー設定ページ
  • 部屋・予約ごとの検索制限
  • 既存の検索パネルから予約ウィジェットを呼び出す
  • 検索バーの設定
  • 子供区分を利用する場合
  • 添い寝を利用する場合(または子供の宿泊を許可していない場合)
  • 日付未定検索設定方法

役に立ちましたか?

  1. 設定

検索バーの設置

検索バーの設置方法をご案内いたします。

前へ施設情報の設定次へヘッダー/フッター・デザイン設定

最終更新 1 年前

役に立ちましたか?

triplaが提供する検索バーの設置方法

子供設定により表示される検索バーが異なります。

詳しい設定方法は下のリンクからご確認ください。

施設管理画面の [設定] → [ウィジェット設定] → [予約ウィジェット]で設定画面を開きます。

​

予約ウィジェットを選択します。

[検索バーを設置]のチェックボックスをオンにします。

複数部屋検索を行わない場合、[複数部屋検索]のチェックボックスをオフにしてください。

検索バー設定ページ

[検索バー設置ページ]以下の設定で表示したいページを指定します。

[全てのページ]を選択した場合の設定

プルダウンから、検索ウィジェットの設定箇所を選択してください。

設定
表示

ページ中央​​

ページ下部固定 

CSSセレクタでの指定

CSSセレクタを入力する事で、HP側のCSSで場所やサイズの指定が可能です。 CSSセレクタでの指定を指定した場合のみ表示されます。また、CSSセレクタの設定はHP制作会社での作業となるので、HP制作会社に問い合わせをを行ってください。

[以下のページ]を選択した場合の設定

表示/除外

表示:検索バーを表示させます。

除外:検索バーを非表示にします。

マッチさせるURLL文字列

URLを入力します。

パターンマッチ

完全一致:入力したURLが全て一致している場合の設定が可能です。

前方一致:入力したURLの前方が一致している場合の設定が可能です。

含む:入力したURLが含まれていた場合の設定が可能です。

表示位置

ページ中央

ページ下部固定

CSSセレクタでの指定

CSSセレクタを入力する事で、HP側のCSSで場所やサイズの指定が可能です。 CSSセレクタでの指定を指定した場合のみ表示されます。また、CSSセレクタの設定はHP制作会社での作業となるので、HP制作会社に問い合わせをを行ってください。

検索バーの表示はブラウザの言語によって自動的に変更されます。

検索バーの検索条件の選択肢を開いた際、要素が隠れてしまう場合は、検索バーのwrapper要素のCSS設定に、”overflow: hidden”が設定されていないかご確認ください。

CSSセレクタを使用される際の注意

CSSセレクタでは、検索バーの表示位置を修正することが可能です。 上記のCSSセレクタ欄に適宜コードを記載し、ご自身のホームページのCSSに検索バーの位置を指定する記述をしてください。 (CSSの記述方法はtriplaではご案内しておりませんので、ホームページ制作担当者様にご相談ください。)

なお、検索バー内の表示、及び各項目(日付・人数プルダウンなど)については、CSSでの編集を行わないでください。こちらはシステムのバージョンアップなどの際に表示が崩れる可能性がありますのでご注意ください。

検索バーの表示はブラウザの言語によって自動的に変更されます。

検索バーの検索条件の選択肢を開いた際、要素が隠れてしまう場合は、検索バーのwrapper要素のCSS設定に、”overflow: hidden”が設定されていないかご確認ください。

CSSセレクタを使用される際の注意

CSSセレクタでは、検索バーの表示位置を修正することが可能です。 上記のCSSセレクタ欄に適宜コードを記載し、ご自身のホームページのCSSに検索バーの位置を指定する記述をしてください。 (CSSの記述方法はtriplaではご案内しておりませんので、ホームページ制作担当者様等にご相談ください)

なお、検索バー内の表示、及び各項目(日付・人数プルダウンなど)については、CSSでの編集を行わないでください。こちらはシステムのバージョンアップなどの際に表示が崩れる可能性がありますのでご注意ください。

部屋・予約ごとの検索制限

予約ページで一度に検索をかけられる室数は9室です。

※初期設定で9室に設定されます。

部屋検索制限の変更は施設管理画面から[設定]→[ウィジェット設定]の中の予約ウィジェットから可能です。

予約ごとの部屋数制限は1回の予約につき35室です。

この数を超えて予約することはできません。

予約ごとの検索制限の変更は、施設管理画面から[設定]→[ウィジェット設定]の中の予約ウィジェットから可能です。

※子供の区分が設定されている場合、予約制限は検索制限と同じです。

※日付指定なしの検索の場合、予約制限は検索制限と同じです。

既存の検索パネルから予約ウィジェットを呼び出す

自前のデザインや既存の検索パネルが既にある場合、javascriptのファンクションで、予約ウィジェットを呼び出すことができます。

window.TriplaBookingWidgetメソッド

window.TriplaBookingWidget
(
 action,
{params},
 'tripla_hotel_code_optional'  // triplabotCode
)

パラメータ(子供区分を利用する場合)

action

'advanced_search'

params

次の属性を持つオブジェクト

checkIn:

必須:'yyyy/mm/dd' フォーマットでチェックイン日の指定

checkOut:

必須:'yyyy/mm/dd' フォーマットでチェックアウト日の指定

adults:

必須:大人人数の指定

kidsTiers: [{ code: 'A', children: 1 }]:

任意:子供の区分と人数を配列で指定 code は区分IDを指定

roomCount:

任意:部屋数の指定。デフォルトでは1が設定

isDayUs:

任意:日帰りプランを検索する場合に指定。 デフォルトではfalse

isDayUse値がtrueの場合、チェックアウト日は不要です。(指定した場合には、無視されます)

'tripla_hotel_code_optional'

任意:ブランド施設の場合には、予約ウィジェットを起動する施設のtriplabotCodeの指定が必要です。

デフォルトでは、 設定コードのtriplabotCodeが指定されています。

パラメータ(添い寝を利用する場合または子供の宿泊を許可していない場合)

action

'advanced_search'

params

次の属性を持つオブジェクト

checkIn:

必須:'yyyy/mm/dd' フォーマットでチェックイン日の指定

checkOut:

必須:'yyyy/mm/dd' フォーマットでチェックアウト日の指定

rooms: [{ adults: 2, children: 0 }, { adults: 1, children: 1 }]

部屋毎の大人人数、子供人数を配列で指定 大人の人数は必須 最低1部屋は必須

isDayUse:

任意:日帰りプランを検索する場合に指定。 デフォルトではfalse

isDayUse値がtrueの場合、チェックアウト日は不要です。(指定した場合には、無視されます)

'tripla_hotel_code_optional'

任意:ブランド施設の場合には、予約ウィジェットを起動する施設のtriplabotCodeの指定が必要です。

デフォルトでは、 設定コードのtriplabotCodeが指定されています。

例:

window.TriplaBookingWidget('search_multiple_room',
 {
 checkIn: '2023/07/17',
 checkOut: '2023/07/18',
 rooms: [
 {
 adults: 2  // 1部屋目に2人
 }, 
 {
 adults: 1  // 2部屋目に1人
 }
 ] 
 }, '60afebc3ac8e15c5d0a497b1ec41d611' // 施設のコード
)

// roomsのArrayに部屋ごとの人数をセットすることで、複数部屋の検索が可能となっています。

弊社予約エンジンの施設の設定コードを読み込むことで、window.TriplaBookingWidget メソッドが利用できるようになります。

メソッドを呼ぶ際に該当するパラメータを引数として渡すことで予約ウィジェットを立ち上げることができます。

※ここでの設定コードとは、tripla管理画面の該当施設のページへ移動後、[設定] → [ウィジェット設定] → [設定]で確認できる設定コード全体を意味します。

設定コードサンプル:

注意事項

既存の検索パネルで施設選択できるドロップダウン・リストがある場合(ブランド施設の場合)、選択された施設の検索結果を表示するために、対象施設のtriplabotCodeを動的に設定していただく必要があります。

※triplabotCodeは、tripla管理画面の該当施設のページへ移動後、[設定] > [ウィジェット設定] > [設定]にある設置コード内より確認できます。

検索バーの設定

施設管理画面の [設定] → [ウィジェット設定] → [予約ウィジェット]で設定画面を開きます。

​

予約ウィジェットを選択し表示させます。

[検索バーを設置]を[オフ]にします。

子供区分を利用する場合と添い寝を利用する場合、または子供の宿泊を許可していない場合、それぞれ設定方法が異なるため、子供設定に応じてご設定ください。

・子供区分を利用する場合

・添い寝を利用する場合(または子供の宿泊を許可していない場合)

子供区分を利用する場合

「子供の区分毎に人数を指定する」の子供設定を行っている場合は、パラメータに区分IDの指定ができます。

子供設定のページで、各区分IDと詳細を確認できます。

子供の区分設定について詳しくは、下のリンクからご確認いただけます。

window.TriplaBookingWidgetメソッドの設定例

window.TriplaBookingWidget('advanced_search', 
{ 
 checkIn: '2021/10/19',
 checkOut: '2021/10/20',
 adults: 3,
 kidsTiers: [{ code: 'A', children: 1 }, { code: 'B', children: 1 }], 
 roomCount: 2, 
 isDayUse: false
},
 '60afebc3ac8e12c5d0a493b1ec41d611')  //  triplabotCode

添い寝を利用する場合(または子供の宿泊を許可していない場合)

以下のいずれかの設定であることを確認します。

・子供の宿泊可否:不可

・子供の宿泊可否:可能、添い寝する子供の人数を指定する

添い寝する子供の人数を指定する 方法について詳しくは、下のリンク からご確認いただけます。

window.TriplaBookingWidgetメソッドの設定例

window.TriplaBookingWidget('advanced_search',
{ 
 checkIn: '2021/10/19',
 checkOut: '2021/10/20',
 rooms: [{ adults: 2, children: 0 }, { adults: 1, children: 1 }], 
 isDayUse: false
}, 
 '60afebc3ac8e12c5d0a493b1ec41d611') //  triplabotCode

日付未定検索設定方法

ねっぱん・らく通・手間いらず・サイトコントローラーをご利用でない施設様のみ設定可能です。

[日付未定検索]をONにすると日付を指定せず検索をかける設定を行う事が可能です。

設定を行うと検索バーに[日付未定]のチェックボックスが表示されます。

検索後の画面は下の画像のように表示されます。

日付未定検索設定についての詳しい情報は下のリンクからご確認ください。

URLパラメーターを使用した立ち上げ

日付未定検索機能を有効にしたうえで、なおかつ検索バーではなく、予約ウィジェットをリンクから立ち上げるように設定されている場合、URLパラメータを指定することで、日付未定検索が有効になった状態(日付未定のスイッチがオンになった状態)で予約ウィジェットを立ち上げることが可能です。

種別
パラメーター

パラメーター

/?tripla_booking_widget_open=search&search_type=undated

サブドメインイ利用時のパラメーター

/#/booking/result?code=[triplaボットコード]&search_type=undated

また、上記日付未定検索のパラメータとあわせて、1泊ではなく2泊以上の連泊指定をしたい場合は、&nights=〇のパラメータを追加することで複数泊の条件で予約ウィジェットを立ち上げるように指定することが可能です。

​

権限

作業・閲覧可否

ブランド管理者

施設管理画面から作業・閲覧可

施設管理者

作業・閲覧可

施設運営者

作業・閲覧不可

ページの中央に配置されます。

左下に配置されます。スクロールをすると追随されます。​

ページの中央に配置されます。

 

左下に配置されます。スクロールをすると追随されます。​

子供設定
子供設定
日付未定検索設定方法
https://docs.tripla.jp/reserved-engine-settings/children-setting