Poradnik Kwiecień 2026 9 min czytania

Jak skonfigurować Microsoft Clarity w 2026: Kompletny poradnik

Microsoft Clarity to darmowe narzędzie analityki behawioralnej od Microsoftu. Oferuje nagrania sesji, mapy ciepła i wykrywanie frustracji użytkowników — bez limitu ruchu i bez opłat. W tym poradniku przeprowadzę Cię przez cały proces: od założenia konta, przez instalację na różnych platformach, po konfigurację API do automatycznego raportowania.

Krok 1: Załóż konto w Clarity

  1. Wejdź na clarity.microsoft.com
  2. Zaloguj się kontem Microsoft, Google lub Facebook
  3. Kliknij Add new project
  4. Wpisz nazwę projektu (np. nazwę strony) i adres URL
  5. Wybierz kategorię strony (e-commerce, SaaS, blog itp.)
  6. Kliknij Create

Clarity wygeneruje unikalny kod śledzenia. Twój Project ID znajdziesz w adresie URL: clarity.ms/app/twoj-project-id/dashboard. Zapisz go — będzie potrzebny przy instalacji.

Krok 2: Zainstaluj kod śledzenia

Clarity wymaga fragmentu JavaScript na każdej stronie Twojego serwisu. Metoda instalacji zależy od platformy.

Instalacja ręczna (dowolna strona)

Skopiuj kod śledzenia z ustawień projektu Clarity i wklej go w sekcji <head> swojego HTML:

<head>
  <!-- Twoje istniejące tagi -->

  <!-- Microsoft Clarity -->
  <script type="text/javascript">
    (function(c,l,a,r,i,t,y){
      c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
      t=l.createElement(r);t.async=1;
      t.src="https://www.clarity.ms/tag/"+i;
      y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
    })(window,document,"clarity","script","TWOJ_PROJECT_ID");
  </script>
</head>

Zamień TWOJ_PROJECT_ID na faktyczny identyfikator z dashboardu Clarity.

WordPress

Clarity ma oficjalną wtyczkę WordPress — instalacja bez dotykania kodu:

  1. W panelu WordPress przejdź do Wtyczki > Dodaj nową
  2. Wyszukaj Microsoft Clarity
  3. Zainstaluj i aktywuj wtyczkę od Microsoft
  4. Przejdź do Ustawienia > Clarity i zaloguj się kontem Microsoft
  5. Wybierz swój projekt z listy rozwijanej
  6. Kliknij Zapisz zmiany

Wskazówka: Jeśli korzystasz z wtyczki cache (WP Super Cache, W3 Total Cache, LiteSpeed Cache), wyczyść cache po aktywacji Clarity. Bez tego zakeszowane strony nie będą zawierać kodu śledzenia aż do wygaśnięcia cache.

Shopify

  1. W panelu Shopify przejdź do Online Store > Themes
  2. Kliknij Actions > Edit Code na aktywnym motywie
  3. Otwórz plik theme.liquid w sekcji Layout
  4. Wklej kod śledzenia Clarity tuż przed tagiem </head>
  5. Kliknij Save

Alternatywnie możesz dodać skrypt przez Settings > Customer events, jeśli wolisz nie edytować kodu motywu.

Google Tag Manager (GTM)

Jeśli zarządzasz skryptami przez GTM:

  1. Utwórz nowy tag typu Custom HTML
  2. Wklej skrypt śledzenia Clarity
  3. Ustaw trigger na All Pages
  4. Opublikuj kontener

To najlepsza metoda, gdy Twój zespół zarządza wszystkimi skryptami zewnętrznymi z poziomu GTM.

Krok 3: Zweryfikuj instalację

Po zainstalowaniu kodu sprawdź, czy wszystko działa. Masz trzy sposoby:

Sposób 1: Dashboard Clarity

Odwiedź swoją stronę, poklikaj przez 30 sekund, wróć do dashboardu Clarity. W ciągu 2-5 minut licznik sesji powinien wzrosnąć z 0 do 1. Pełne dane mogą pojawić się po 2 godzinach.

Sposób 2: Narzędzia deweloperskie przeglądarki

Otwórz stronę i naciśnij F12. W zakładce Network filtruj po clarity. Powinieneś zobaczyć requesty do www.clarity.ms ze statusem 200.

Sposób 3: Rozszerzenie przeglądarki

Zainstaluj rozszerzenie Microsoft Clarity dla Chrome lub Edge. Ikona pokaże zielony znacznik, gdy Clarity jest aktywne na odwiedzanej stronie.

Uwaga: Jeśli kod nie działa, sprawdź nagłówki Content Security Policy (CSP). Może być konieczne dodanie *.clarity.ms do dyrektyw script-src i connect-src.

Krok 4: Skonfiguruj ustawienia prywatności

Zanim Clarity zacznie zbierać dane na dużą skalę, skonfiguruj maskowanie:

  1. Przejdź do Settings > Masking w projekcie
  2. Wybierz tryb maskowania:
    • Balanced (domyślny): maskuje dane z formularzy, ale pokazuje tekst strony i obrazy
    • Strict: maskuje cały tekst — widoczny jest tylko layout i interakcje
    • Relaxed: pokazuje wszystko, łącznie z danymi z formularzy — stosuj tylko na stronach bez danych wrażliwych

Dla konkretnych elementów możesz wymusić maskowanie dodając atrybut data-clarity-mask="true" do HTML. Jeśli Twoja strona zbiera dane osobowe (email, telefon, imię), zostaw tryb Balanced.

Krok 5: Połącz z Google Analytics 4

Clarity integruje się z GA4, co pozwala łączyć dane behawioralne z istniejącą analityką:

  1. Przejdź do Settings > Google Analytics Integration
  2. Kliknij Get Started i zaloguj się kontem Google
  3. Wybierz właściwość GA4 odpowiadającą Twojej stronie
  4. Zatwierdź połączenie

Po połączeniu możesz filtrować nagrania Clarity po segmentach GA4 — np. "użytkownicy, którzy dokonali zakupu" lub "ruch z wyszukiwarki organicznej".

Krok 6: Wygeneruj token API

Aby korzystać z automatycznego raportowania lub integracji z zewnętrznymi narzędziami, włącz API eksportu danych:

  1. Przejdź do Settings > Data Export
  2. Kliknij Generate API Token
  3. Skopiuj i bezpiecznie zapisz token

Endpoint API:

GET https://www.clarity.ms/export-data/api/v1/project-live-insights
Authorization: Bearer TWOJ_API_TOKEN

API zwraca dane JSON z metrykami per strona, sygnałami frustracji i liczbą sesji. Limity: 10 zapytań dziennie na projekt, dane dostępne maksymalnie 3 dni wstecz.

Rozwiązywanie typowych problemów

ProblemPrawdopodobna przyczynaRozwiązanie
Brak danych po 24 godzinachSkrypt się nie ładujeSprawdź zakładkę Network w przeglądarce
Skrypt działa, ale brak nagrańCSP blokuje transmisję danychDodaj *.clarity.ms do CSP connect-src
Nagrania pokazują pustą stronęWłączony tryb StrictPrzełącz na tryb Balanced w Settings
Mniej sesji niż w GA4Blokery reklam u użytkownikówTo normalne — część użytkowników blokuje tracking
Mapa ciepła nie ładuje się dla URLZa mało danych dla tej stronyPoczekaj na więcej sesji lub sprawdź format URL

Co dalej?

Po zainstalowaniu i zweryfikowaniu Clarity:

  1. Poczekaj 3-5 dni na zgromadzenie wystarczającej ilości danych
  2. Sprawdź sygnały frustracji na dashboardzie — zajmij się rage clickami i dead clickami od razu
  3. Przejrzyj mapy ciepła na stronach z największym ruchem
  4. Obejrzyj 10 nagrań przefiltrowanych po sygnałach frustracji
  5. Wyznacz cotygodniowy przegląd — 30 minut w poniedziałek na analizę danych

Chcesz automatyczne raporty z Clarity?

ClarityInsights analizuje Twoje dane i wysyła cotygodniowy raport AI z rekomendacjami UX.

Dołącz do waitlisty

Powiązane artykuły

Rage Clicks i Dead Clicks w Clarity: Co oznaczają i jak je naprawić Microsoft Clarity API w Pythonie: Kompletny poradnik