0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

ガイドターゲティング:複数同じエレメントがあった場合、指定のエレメントをターゲットする方法

0
Last updated at Posted at 2024-05-29

ターゲットするエレメントを指定する

自分メモシリーズ

画面上に複数同じ属性値をエレメントがあった場合、Pendoは最初に見つかったエレメントに対してガイドをターゲットします。

CleanShotGQlDAaO1@2x.png

指定の場所にガイドを出すには、Code blockを使って表示場所を書き換える必要があります。

//要素を取得する
const elements = document.querySelectorAll('#likebtn');
//例:最後のエレメントを探す
const lastElement = elements.length - 1
//ガイドのターゲットを書き換える
pendo.getActiveGuide().step.element = elements[lastElement]

CleanShota09IoVvg@2x.png

追記:
step1で最後のエレメントにカスタム属性等を追加し、step2でそのカスタムにターゲットする手法

//step 1
//element郡を取得
const elements = document.querySelectorAll('#likebtn');
const lastElement = elements.length - 1
//最後のエレメントにカスタム属性を追加
elements[lastElement].setAttribute('lastman','yes')
//ガイドを進める
pendo.onGuideAdvanced()

step2のガイドターゲットを[lastman='yes']に指定

こうすることで、stepターゲットの上書きをしなくても良くなる。
CleanShotxfewU4YL@2x.png

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?