Microsoft ClarityをShopifyに入れる方法｜無料ヒートマップの使い方

「どこまで読まれているか」「どのボタンが押されているか」は、Shopifyの標準レポートだけでは分かりません。ヒートマップを使うと、お客様の動きを色の濃さで見られます。

この記事では、無料で使えるMicrosoft ClarityをShopifyに入れる手順と、使う前に知っておきたい点をまとめました。内容は2026年11月11日にMicrosoftの公式ドキュメントとShopify App Storeで確認したものです。

Microsoft Clarityとは

Clarityは、Microsoftが提供する行動分析ツールです。公式のFAQには、ずっと無料で、トラフィックの上限も有料版への切り替えも無いと書かれています。

掲載ページの主な機能は、セッションの録画、ヒートマップ、AIによる分析、コンバージョンまでのファネルです。画面は日本語で使えますが、問い合わせは英語になると考えておきましょう。

Shopifyに入れる手順

Shopify向けの導入手順では、アプリから入れる方法が案内されています。テーマのコードを編集する必要はありません。

1. アプリをインストールする

   Shopify App Storeで「Microsoft Clarity: AI Insights」を開き、「インストール」を押します。

2. アクセス権限を確かめる

   表示されたデータへのアクセス権限を確かめて、「インストール」を押します。

3. Clarity JSをオンにする

   「Go to app settings」を押すと新しいタブが開きます。「Clarity JS」がオンになっていることを確かめて「Save」を押し、タブを閉じます。

4. 画面を更新する

   インストールの画面に戻ります。自動で切り替わらないときは「Refresh」を押します。

データがダッシュボードに出るまでには数時間かかります。すぐに数字が出なくても、しばらく待ってから確かめましょう。

Shopify Plusのストアでは、チェックアウトと購入後のページもShopifyのピクセルを通じて計測されます。

見られるヒートマップの種類

ヒートマップの公式解説によると、Clarityでは5種類のヒートマップを使えます。パソコン、タブレット、スマホの表示を切り替えて比べられ、最低限のアクセス数の条件もありません。

クリックマップでは、押しても何も起きない「デッドクリック」や、何度も連打される「レイジクリック」も絞り込めます。リンクに見えて押せない画像や、反応の遅いボタンを見つけるのに役立ちます。

使う前に知っておきたいこと

データは30日で消える

公式のFAQによると、録画などのデータを見られるのは記録から最大30日です。セールの前後を比べたいときは、期間内に確認しておきましょう。

入力欄は自動で隠される

マスキングの公式解説によると、初期設定は「Balanced」で、数字とメールアドレスが隠されます。入力欄とドロップダウンは、どのモードでも常に隠されます。

設定を変えても反映されるのは新しい録画からで、過去の録画には適用されません。

欧州からのアクセスには同意が要る

FAQでは、欧州経済領域 (EEA)、英国、スイスのユーザーには、Cookieを置く前に明示的な同意が必要とされています。同意が無いと、セッションが途切れるなど一部の機能が制限されます。国内のお客様だけなら影響はありませんが、海外にも販売するストアはCookieバナーの設定を確かめましょう。

他のヒートマップアプリと迷ったら

Clarityは無料で始められる一方、日本語での直接サポートはありません。カゴ落ちの分析や有料のサポートも比べたいときは、Recoketの代わりを比較した記事でLucky Orangeとの違いをまとめています。

まずは売上の多い商品ページを1つ決めて、スクロールマップで説明が読まれているかを確かめるところから始めると、直す場所を絞りやすくなります。

よくある質問

AI を、いつもの業務に組み込む。 無料で相談する →