「埋め込み」テンプレートを使ったアクションが想定通り表示されない場合に、考えられる原因と対処法を紹介します。
アクションが想定通り表示されない問題は、大きく次の2つに分類されます。
- アクションの表示が崩れる
- アクションが表示されない
それぞれのケースについて説明します。
アクションの表示が崩れる場合
次のような場合、アクションの表示が崩れます。
サイト側のCSSと干渉している
「埋め込み」テンプレートのアクションが、サイトに定義されているCSSの影響を受けることで、意図しないスタイルが適用され、表示が崩れる場合があります。
「埋め込み」テンプレートを構成するHTMLに適用されているCSSを確認し、サイトに定義されているCSSの影響を受けていないかどうか確認してみてください。
アクションが表示されない場合
次のような場合、アクションが表示されません。
接客サービスが配信されていない
次のチェックリストを見ながら接客サービスが配信されているかどうかを確認してみてください。
ブラウザのコンソールにエラーが表示されている
次のようなエラーがブラウザのコンソール上に表示されていないか確認してみてください。
karte.tracker error: DOMException: Failed to execute 'querySelectorAll' on 'Document': 〇〇 is not a valid selector.
埋め込み先となるCSSセレクタの記述方法自体に誤りがある場合に発生するエラーです。CSSセレクタの取得・検証をするを参考にCSSセレクタを設定し直してください。
krt error: cant find target:〇〇
「埋め込み」テンプレートのアクションの [埋め込み設定 > 埋め込み先CSSセレクタ] に指定したCSSセレクタに対応する要素がページ上に存在しない場合に発生するエラーです。
補足
このエラーが出ている場合、KARTE Action Viewerやユーザーストーリーではmessage_openが発生していてもアクション表示されていない状態がありえます。
大きく2つのケースが考えられます。
- 要素が存在しない
- CSSセレクタの取得・検証をするを参考にCSSセレクタを設定し直してください
- 要素は存在する
- アクション配信時にまだ埋め込み先の要素がページ上に存在していない可能性があります
- 「埋め込み」アクションの埋め込み先要素が非同期に挿入される場合の対応をご参照ください
置き換えができないHTML要素を利用している
一部のHTML要素は、「埋め込み」テンプレートのアクションで置き換えができません。詳細は、埋め込みアクションで要素の書き換えに失敗するHTML要素をご参照ください。