ガイドステップを複数のページで有効化する

最終更新日:

ほとんどの場合、ガイドは有効化されたページに表示されます。この場合、あるページでの操作が終わった後にガイドを有効化して、ユーザーが別のページにアクセスしたときに表示されるようにします。このアプローチを行うと、あるページで始まり、別のページに続くマルチステッププロセスでユーザーを誘導しやすくなります。

異なるページでガイドステップを有効化する方法については、Pendo Academyに掲載している動画をご視聴ください。

ガイドのセグメントとアクティベーションを設定する

まず、ガイドを作成して設定します。

  1. Pendoでガイドを作成します。
  2. ガイドのターゲットユーザーセグメントを定義して、その関連性を確保します。
  3. ガイドを有効にしたいプロダクト内の最初のページに移動します。
  4. [ステップを表示(View Steps)]を選択し、[アクティベーション(Activation)]ステップの[編集(Edit)]アイコンを選択します。
  5. アクティベーション方法を[ターゲット要素(Target element)]に設定し、ガイドを開始する最初のページ上の特定のボタンまたは要素を選択します。
  6. アクティベーションが正しいターゲット要素に対して設定されていることを確認します。

非表示の開始ステップを設定する

最初のガイドステップを、ガイドを2番目のページに進めるための非表示ステップとして設定します。ガイドには最初のステップが既に作成されており、ユーザーはまだガイドを有効化したいプロダクトの最初のページにいます。

  1. [スタイリング(Styling)]の背景オプションがオフになっていることを確認します。
  2. [場所(Location)]タブで、ターゲットページ(Page Location)を[当該ページのみ(Only on this page)]に設定します。
  3. ステップにコードブロックを追加します。
    1. ユーザーのアクションなしで非表示のガイドステップを進めるために、[Javascript]タブで次のルールを追加します。
      pendo.onGuideAdvanced();
    2. ガイドを非表示にするために、[CSS]タブで次のルールを追加します。
      opacity:0;
  4. [完了(Done)]を選択して終了します。非表示のステップは表示されず、ガイドのステップでのみ確認できます。

表示されるガイドステップを作成する

ガイドに新しいステップを追加します。これはガイドの2番目のステップですが、ユーザーにとっては最初に目にするステップです。

  1. ビジュアルデザインスタジオ(Visual Design Studio)で[移動(Navigate)]を選択し、最初に目にするガイドステップを表示するページに移動します。
  2. [ステップを表示(View Steps)]を選択し、次に[ステップを追加(Add Step)]を選択します。
  3. [新しいステップを追加(Add New Step)]ページで、新しいステップに必要なレイアウトを選択します。
  4. ターゲット要素を選択します。
  5. [場所(Location)]タブで、ターゲットページ(Page Location)を[当該ページのみ(Only on this page)]に設定します。
  6. このページのユーザージャーニーに固有のコンテキストに応じて、ステップをカスタマイズします。

    new_guide.png
  7. 必要に応じて、ガイドステップを追加しします。

ガイドをテストする

上記の手順により、あるページのボタンの選択から開始し、別のページでガイダンスが提供されるようガイドが設定されました。滞りなく利用できるよう、ガイドとページ間の遷移をテストすることを強くお勧めします。

 

この記事は役に立ちましたか?
22人中0人がこの記事が役に立ったと言っています