ご利用方法
- ブラウザ画面右上の拡張機能アイコンをクリックする
- 要素にカーソルを移動させ右クリックする
- 施策の編集画面のセレクター入力欄にペーストする
ご利用前にご確認いただきたいこと
お客様のプロダクト上で実際にいくつかの要素からセレクターを取得してください。
その際、このようなランダム文字列を含むクラス/IDが取得されているか、ご確認ください。
例:.sc-AxjAm
、.bKgGTQ
、.css-10uajgf
、.guideList--l7FAo
、#bag4ag
、#12-fas-4-afs
ランダム文字列を含むクラス/IDが取得された場合
お客様のプロダクトのリリースなどに伴い、クラス/IDのランダム文字列部分が変化する仕様の可能性があります。 ※ ランダム文字列が変化しないシステム仕様であればこの先の対応は不要
クラス/IDが変化により要素が見つからず、Onboardingの施策が動作しない場合があります。
この問題の対応策として、Google拡張機能(Onboarding Guide Editor)の「高度な設定」オプションを利用してください。
以下のパターンごとに対応を行なってください。
①ランダム文字列がクラスに含まれる場合
例: .sc-AxjAm
、.bKgGTQ
(単語の先頭に「.」がついている場合はクラス)
対応方法:「クラス名を使用」のチェックを外して要素を取得する
②ランダム文字列がIDに含まれる場合
例: #bag4ag
、#12-fas-4-afs
(単語の先頭に「#」がついている場合はID)
対応方法:「IDを使用」のチェックを外して要素を取得する
高度な設定とは
セレクターの形式を指定するためのオプションです。 クラス名を使用・ID名を使用・文言指定を使用の3つを用意しています。 デフォルトでは3つ全て選択されています。
- クラス名を使用を外すべき例
- クラス名が乱数で生成されてしまう場合(例:
sc-AxjAm
、bKgGTQ
) - 一時的な状態を表す言葉がクラス名に含まれる場合
(例:
modal_close
、modal_open
、menu_expand
、menu_collapse
、is_active
)
- ID名を使用を外すべき例
- ID名が乱数で生成されてしまう場合(例:
#23ds2gdfa3
)
- 文言指定を使用を外すべき例
- 名前などのユーザー毎に異なる文言が表示される場合(例:
p:contains('テスト太郎')
) - 文言変更が行われる可能性が高い場合