O que é o Microsoft Clarity

Uma ferramenta gratuita da Microsoft para analisar o comportamento dos utilizadores. Oferece mapas de calor, gravações de sessões e relatórios automáticos de problemas de UX.

Categoria de cookies

O Microsoft Clarity pertence à categoria analytics.

Instalação com o Consentio

Adicione o código de monitorização do Microsoft Clarity com os atributos type="text/plain" e data-category="analytics", para que só seja carregado depois de o consentimento de analítica ser concedido:

<!-- Microsoft Clarity - bloqueado até haver consentimento de analítica -->
<script type="text/plain" data-category="analytics">
  (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","YOUR_CLARITY_ID");
</script>

Alternativa com API JavaScript

Carregue o Microsoft Clarity dinamicamente depois de o consentimento ser concedido:

Consentio.onConsentChange((consent) => {
  if (consent.analytics) {
    // Carregar o Microsoft Clarity
    (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","YOUR_CLARITY_ID");
  }
})

Integração via GTM

No Google Tag Manager, adicione uma tag Microsoft Clarity com um requisito de consentimento para analytics_storage. O Clarity está disponível como modelo da comunidade na Galeria de Modelos do GTM.

Google Consent Mode v2

O Microsoft Clarity suporta o Google Consent Mode. Se utilizar o GTM, basta definir o requisito de consentimento para analytics_storage.

Verificação

1. Abra o DevTools (F12) → separador Rede
2. Antes do consentimento: clarity.ms não deve ser carregado
3. Conceda o consentimento de analítica
4. Verifique clarity.ms no separador Rede
5. Verifique no painel do Clarity