Product Tourの設計時には、まず構築したいウェブサイトを選択する必要があります:
ウェブサイトを開いたときに、ツアービルダー(この青いバー👇)が表示されないことがあります。
Tourビルダーが見えない場合、確認すべきことが3つあります:
Messengerがサイトにインストールされているか確認してください
Product Tourを設計するには、Messengerが構築したいサイトにインストールされている必要があります。インストールされていない場合、Tourビルダーは読み込まれません。例えば、製品内でツアーを作成したいが、ログアウトした訪問者向けにのみMessengerがインストールされている場合、Tourビルダーは製品内に表示されません。
Messengerがインストールされていない場合は、以下のガイドを参照して開始してください:
ログアウトした訪問者向けにTourを作成する場合は、サイトにMessengerをインストールしてください。
ログインしたusers向けにTourを作成する場合は、製品にMessengerをインストールしてください。
あなたのサイトはサードパーティのiframe内に埋め込まれていますか?
Product Toursは、サイトがサードパーティのiframe内に埋め込まれているページでは機能しません。
Intercom Messengerは常に独自のiframe内でレンダリングされますが、これは期待される動作で変更できません。ただし、あなたのサイトや製品自体がサードパーティのiframe内(例えば、Shopify AppやFigma Plugin)で読み込まれている場合、Messengerはiframeを含む親ページの情報にアクセスできません。
このような場合、Product Toursはサポートされません。
あなたのサイトはwindow.openerを変更していますか?
Tourビルダーはwindow.openerプロパティを使ってIntercomアプリと通信します。サイトのJavascript(または使用しているライブラリ)がこれを上書きしている場合、Tourビルダーは動作しません。
Cross-Origin-Opener-Policyヘッダーを確認してください
MessengerがインストールされているにもかかわらずTooltipビルダーがサイト上でツールを読み込まない場合、Cross-Origin-Opener-Policyヘッダーを確認してください。このヘッダーはビルダーとMessenger間の通信をブロックする可能性があります。Cross-Origin-Opener-Policyヘッダーの値がデフォルトのunsafe-none以外の場合、window.openerの設定が妨げられ、Tourビルダーは読み込まれません。ヘッダーをunsafe-noneに更新するか削除して、ビルダーが正しく機能するようにしてください。
Cross-Origin-Opener-PolicyはTourを構築している間のみ"unsafe-none"に設定する必要があります。これによりTourビルダーのツールが表示・機能します。Tour構築後は"unsafe-none"設定を好みの値に変更可能で、サイトのCross-Origin-Opener-Policy設定はエンドユーザーに表示される"Live" Tourの表示に影響しません。
正しいIntercomワークスペースにいることを確認してください
複数のIntercomワークスペース(例:異なるウェブサイト用)がある場合、Tourを設計しているワークスペースが構築しているページにインストールされているものと同じであることを確認してください。
これを確認するには、IntercomのProduct ToursページのURLにあるワークスペースIDを見てください:
次に、Tourを構築しているページでブラウザのコンソールを開き、以下のコマンドを貼り付けます window.intercomSettings.app_id:
これらのIDが一致しない場合は、Intercomで正しいワークスペースに移動し、そこでTourの構築を開始する必要があります。
注意:この方法は標準のJavaScriptインストールでのみ機能します。
IPアドレスでページにアクセスしていますか?
Product Tourビルダーを読み込むには、123.4.5.67のようなIPアドレスではなく、https://www.examply.comのような完全修飾ドメインでウェブサイトを開く必要があります。
モーダルやダイアログボックス内でツアーを作成していますか?
一部のモーダルウィンドウやダイアログボックス(ポップアップ)では、“Focus trapping”によりTourのメッセージに内容を入力できないことがあります。
ここに入力しようとすると:
フォーカスが別の要素にジャンプします。(これは目に見えない場合があります):
これはTourの構築体験にのみ影響し、顧客への表示方法には影響しません。Tourを構築するために一時的に“focus trapping”を無効にし、構築後に再度有効にすれば、問題なく顧客に送信されます。
フォーカストラッピングを使用しているかどうかを確認し、一時的に無効にするために、チームのエンジニアや開発者に確認する必要があるかもしれません。
まだ問題がありますか?
正しいワークスペースがサイトにインストールされていてもTourビルダーが読み込まれない場合は、Messengerでチャットしてください。喜んでお手伝いします。
