概要
特に複数のiframeを使用しているサイトにおいて、ガイド、ページのタグ付け、フィーチャーのタグ付けを行う際に、優れたiframeの操作性を実現するために、Pendoはビジュアルデザインスタジオを開発しました。ビジュアルデザイナーは「iframe対応」であり、アプリケーション内のiframeの存在を検出して、使いやすいUIで表示し、アナリティクスやガイドのターゲティングのためにそれらをタグ付けすることができます。また、ビジュアルデザイナーはプラグインや拡張機能が不要で、ネイティブでiframeをサポートします。この方法は、ブラウザに事前に追加の拡張機能をインストールする必要がないため、より安全です。
iframe設定サポートとルール
ここでは、Pendoでiframeでの優れた操作性を実現するためのベストプラクティスガイドラインをご紹介します。
- ルール1：上位のウィンドウには、Pendo Agentがインストールされている必要があります。
注：厳密には、これはPendoがiframeサイトで動作するための必須要件ではありませんが、ビジュアルデザイナーを使用する場合に優れた操作性を実現します。
- ルール2：最上位の1つのウィンドウまたはiframeには、Pendo Agentがインストールされている必要があります。上位のウィンドウにPendo Agentがインストールされていない場合は、すべての「子」iframeを含む「親」iframeが1つ必要です。
- ルール3：Pendo Agentは、最上位のウィンドウまたはiframeと、Pendoをインストールする「子」iframeの間にあるすべてのiframeにインストールする必要があります。
注：これは、無効な設定の例です。iframeが親子関係になっている場合、各iframeにPendo Agentがインストールされている必要があります。Pendo Agentがインストールされていないiframeがあると、子iframeが最上位のiframeのPendo Agentに遡ることができないため、正しく動作しない場合があります。
- ルール4：Pendo Agentのすべてのインスタンスは、最上位のウィンドウまたはiframeと同じサブスクリプションキーを使用する必要があります。
注：サブスクリプションキーは、JavaScriptのスニペットの下部にあるインストールのスニペットに含まれています。
- ルール5：ルール3が守られている限り、Pendoはネストされたすべてのiframeをサポートします。
ガイドとiframe
ビジュアルデザインスタジオでは、Pendo Agentのアップデートにより、iframeでガイドを表示する際のサポートが改善されました。すべてのiframeのPendo Agentは、個々のiframeが読み込まれるたびに相互にコミュニケーションします。これにより、Pendo Agentは各iframe間でページルールやターゲット要素を確認し、その時々でガイドを表示するのに最適なiframeを決定することができます。また、Pendo Agentで確立されたコミュニケーションにより、複数のiframeでウォークスルーを続けることができ、アプリ全体を通してお客様をシームレスに誘導することができます。
ウォークスルーを作成する際、個々のガイドステップを個別のiframeまたは個別のページやフィーチャー（組み合わせまたは両方）に割り当てることができます。これにより、複数のiframeにまたがるガイドコンテンツを作成できます。
ページやフィーチャーのタグ付けとiframe
各iframeにPendoをインストールした後、ビジュアルデザインスタジオ使って、任意の数のiframeにページやフィーチャーをタグ付けすることができます。ビジュアルデザインスタジオでは、iframeを視覚的にもURLによっても簡単に識別できるため、適切なタグ付けが可能です。フィーチャーのタグ付けも、アプリケーションにiframeがない場合とまったく同じ作業手順を行います。
