KARTE Blocksで設定したブロックが更新されない場合には、下記チェックポイントを上から順番に確認してください。

更新されない場合のチェックポイント

  • 対象のページでBlocksタグが正しく設置されているか？
  • ページ登録時のURL条件が合っているか？
  • ブロックエリアのCSSセレクタが合っているか？
  • 同じURL条件でページ登録・ブロックエリアが登録され、優先度が高く設定されていないか？
  • コードを直接編集している場合、親要素が2つ以上に分けて登録していないか？
  • ブラウザのキャッシュが残っていないか？
  • 設定内容がサイトに配信されているか？
  • ブロックに設定している配信条件に合致しているか？
  • アクセスした際に未実施グループに割り振られていないか？
  • KARTEの施策とバッティングしていないか？

対象のページでBlocksタグが正しく設置されているか？

Blocksタグがページに設置されているか？

ブロックを更新したいページにBlocksタグ（builder.js）が埋め込まれているかを確認します。確認方法は下記です。

  • Chrome DevToolsを開く（ブラウザで右クリック→検証をクリック）
  • 検索窓を表示する（Windows：Control＋F、Mac：Command＋F）
  • 検索窓にbuilder.jsと入力

Blocksタグが設置されていると、下記のように該当のHTMLが黄色にハイライトされます。検索にヒットしない場合はBlocksタグが設置されていません。

null

Blocksタグが複数読み込まれていないか？

検証プロジェクトと本番プロジェクトを分けて運用する際、同じページに異なるBlocksタグが複数設置される場合があります。Blocksタグは一つのページに複数設置されることを想定としていません。複数埋め込まれた場合、一番上部に設置されたBlocksタグのみ読み込まれるようになっています。

コンソール上でエラーが発生していないか？

Chrome DevToolsのConsoleタブでBlocksタグ(builder.js)関連のエラーが出ていないか確認してください。

null

ページ登録時のURL条件が合っているか？

ページ一覧画面で設定したURL条件と対象のページが合っているか確認します。対象のページで拡張機能のアイコンをクリック→「ツールバーを表示」ボタンをクリックします。

ページ登録のURL条件が合っている場合は、ツールバー右下に設定したページ名が選択されています。

null

ページ登録のURL条件が間違っている場合、ツールバー左下に「ページグループに登録されていないため、この機能は利用できません」といったアラートが表示されます。

null

よくある間違い例

  • URL末尾に「/」が含まれているのに「/」を含まない形で完全一致で設定してしまった
  • URLにクエリ文字列（パラメータ）が含まれる場合を考慮せずに、クエリ文字列なしのURLを完全一致で設定してしまった

ブロックのCSSセレクタが合っているか？

Blocksでは、CSSセレクタを元にブロックの更新を行っています。CSSセレクタの値が正しくないとブロックの更新が行われません。下記の操作を行うことで、ブロックエリアのCSSセレクタを検索することができます。

  • エリアの詳細 > エリア指定 > CSSセレクタの値をコピー
  • ブラウザのdevloper toolを開く（ブラウザの右クリック→検証をクリック）
  • 検索窓を表示する（Windows：Control＋F、Mac：Command＋F）
  • コピーした値をペーストする

CSSセレクタの値が正しい場合、下記のように該当のHTMLが黄色にハイライトされます。検索にヒットしない場合はCSSセレクタの指定が誤っている可能性が高いです。

null

以下のようなケースに該当する場合、Blocks側で編集したブロックのCSSセレクタと実際のCSSセレクタが異なることがあります。

  • Blocksで更新したいページでCMSを併用しており、コンテンツの追加・削除等を行っている
  • 会員・非会員など、ユーザーの属性によってサイトのHTML構造自体が異なる
  • サイト側のリニューアルや改修などでHTMLの構造自体が変更された

定常的にCSSセレクタの値が変更される場合は、拡張機能を用いた指定ではなく、ID属性や属性セレクタのように、HTMLの構造や順序に依存しない形でブロックエリア指定していただくようお願いいたします。

同じURL条件でページ登録・同一ブロック編集、優先度が高く設定されていないか？

より高い優先度設定で同じURL条件でページグループが登録されており、編集しているブロックも同じではないかご確認ください。

優先度が高いページの設定が先に適用されるため、優先度が低く設定されていると変更が適用されません。
優先度が高いページの設定を見直し、優先度の変更やページの削除等お願いします。

コードを直接編集している場合、ルート要素が2つ以上に分けて登録していないか？

１つのブロックは、１つのルート要素ごとに設定することができます。
そのため、コードで直接ブロックを編集・前後追加する場合、ルート要素が１つになるように設定してください。

例1）設定可能なブロック → ルート要素が1つ

    <div>
      <p> テスト </p>
    </div>

例）設定不可能なブロック → ルート要素が２つ以上になっている

    <div>
      <p> テスト </p>
    </div>
    <div>
      <p> テスト </p>
    </div>

配信条件で設定しているセグメントに合致しているか？

ブロックに設定している配信条件で設定しているセグメントに自分が合致しているか確認します。設定しているセグメントに合致していない場合は、配信が行われません。

Blocksセグメントに合致している確認する方法

Blocksの拡張機能のアイコンをクリックすると、下記のように合致しているセグメント情報を確認できます。

null

KARTEのセグメントに合致しているか確認する方法（KARTEを併用している場合のみ）

KARTEのセグメントを設定している場合は、Chrome DevToolsでLocalStorageを確認します。具体的に方法は下記になります。

①Applicationタブを選択
②Local Storageを選択
③Keyでkrt___segmentsを選択
④Valueがすべて表示される

null

④のvalue内に合致しているセグメントのIDが配列形式で格納されているので、ユーザーストーリー画面で自分がそのセグメントに合致しているの確認します。

設定内容がサイトに配信されているか？

管理画面で設定した内容はBlocksタグが配信された時点でサイトに反映されます。Blocksタグが配信されているかどうかは、配信履歴ページから確認することができます。
（管理画面での設定からBlocksタグの配信までは数秒〜十数秒程度かかります。）

null

キャッシュが残っていないか？

ブロックの配信後30秒間はCDN(Amazon CloudFront)に配信前の状態がキャッシュされています。下記のショートカットキーを使ってキャッシュをクリアした上で最新のブロックに更新されるか確認してください。

  • Windows：Shift + F5
  • Mac： shift + command + r

未実施グループに割り振られていないか？

配信条件で未実施の割合を設定している場合、設定した割合でブロックの更新が行われません。自分が未実施グループに入っているか、下記の方法で確認できます。

  • Chrome DevToolsを開く（ブラウザで右クリック→検証をクリック）
  • コンソールタブで以下のコマンドを入力する
    • __KARTE_REWRITE_ADMIN_CONFIG.util.enable_logger(true)
    • ログを流さないようにする場合は引数をfalseにして再度コマンドを実行してください。
  • 画面をリロードすると下記のようにコンソールにログが流れるようになります。

その後、コンソール上で以下の値を確認してください。

  • [Conditions]-> 該当の配信条件を選択し、isControlForConditionがtrueになっていないか？
    • trueの場合、未実施グループに割り振られています。

KARTEの施策とバッティングしていないか？

(KARTE Actionと併用している場合のみ)

KARTE Actionの接客サービスでBlocksと同じ場所を編集している場合、Blocksでの書き換えは実行されません。同じ場所を編集していないかご確認ください。

それでも更新が行われない場合は？

上記のほか、サイト側で配信されているJavaScriptによって挙動を制御している場合（例： クリック時の遷移先を変更）、配信したブロックが正しい挙動にならない事象も報告されています。

ご不明の場合は、追加の調査を行いますので、チャットサポートでお問い合わせください。

#karte_blocks