Documentație Tracking și Evenimente

Tot ce ai nevoie pentru a instala ClearAnalytics pe site-ul tău și a urmări vizualizări de pagină, evenimente personalizate, obiective de clic și tranzacții e-commerce.

Prezentare generală

ClearAnalytics oferă două variante de script de tracking. Alege-o pe cea care se potrivește nevoilor tale: un script minimal pentru analitice de bază ale vizualizărilor de pagină, sau un script complet pentru evenimente personalizate, obiective de clic și tracking e-commerce.

Script Ușor (ca.js)

Cel mai ușor script de tracking posibil. Perfect pentru bloguri, landing page-uri și site-uri care au nevoie doar de analitice ale vizualizărilor de pagină.

ca.js < 1 KB

Tracking automat al vizualizărilor de pagină
Durata sesiunii și rata de respingere
Captarea parametrilor de campanie UTM
Suport pentru aplicații single-page

Script Complet (ca-events.js)

Tot ce include scriptul ușor, plus evenimente personalizate, tracking de obiective de clic, interceptare GA4 dataLayer și suport complet pentru e-commerce.

ca-events.js < 2 KB

Tot ce include scriptul ușor
Tracking de evenimente personalizate prin window.ca()
Tracking de obiective de clic prin data-ca-goal
Integrare GA4 dataLayer
Tracking complet de evenimente e-commerce

Instalare

Adaugă o singură etichetă script pe site-ul tău. Fără pachete npm, fără instrumente de build, fără fișiere de configurare. Scriptul se încarcă asincron și nu are niciun impact asupra performanței paginii.

HTML — Script Ușor

Adaugă acest cod în <head> sau la sfârșitul <body> pe fiecare pagină. Urmărește automat vizualizările de pagină, durata sesiunii și parametrii UTM.

<script defer src="https://clearanalytics.eu/js/ca.js"></script>

HTML — Script Complet

Folosește această variantă dacă ai nevoie de evenimente personalizate, obiective de clic sau tracking e-commerce.

<script defer src="https://clearanalytics.eu/js/ca-events.js"></script>

HTML — Script Complet cu DataLayer

Adaugă atributul data-ca-datalayer pentru a intercepta automat evenimentele GA4 dataLayer, inclusiv toate evenimentele e-commerce.

<script defer src="https://clearanalytics.eu/js/ca-events.js" data-ca-datalayer></script>

WordPress

Adaugă eticheta script prin fișierul functions.php al temei tale sau folosește un plugin de injectare header/footer.

// functions.php
add_action('wp_head', function () {
    echo '<script defer src="https://clearanalytics.eu/js/ca-events.js"></script>';
});

React / Next.js

Folosește componenta Script din Next.js pentru încărcare optimă. Scriptul funcționează cu orice framework React.

// app/layout.tsx  (Next.js App Router)
import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html>
      <head>
        <Script
          src="https://clearanalytics.eu/js/ca-events.js"
          strategy="afterInteractive"
        />
      </head>
      <body>{children}</body>
    </html>
  );
}

Vue / Nuxt

Adaugă scriptul prin configurația Nuxt sau direct în template-ul HTML pentru aplicații Vue simple.

// nuxt.config.ts
export default defineNuxtConfig({
  app: {
    head: {
      script: [
        {
          src: 'https://clearanalytics.eu/js/ca-events.js',
          defer: true,
        },
      ],
    },
  },
});

Google Tag Manager

Poți de asemenea deplasa scriptul prin Google Tag Manager folosind o etichetă Custom HTML.

Tag Type:   Custom HTML
Trigger:    All Pages

<script defer src="https://clearanalytics.eu/js/ca-events.js" data-ca-datalayer></script>

Când folosești GTM cu atributul data-ca-datalayer, ClearAnalytics va captura automat toate evenimentele dataLayer trimise de etichetele GTM existente.

Evenimente Personalizate

Urmărește orice interacțiune a utilizatorului trimițând evenimente personalizate cu metadate opționale. Evenimentele personalizate apar în panoul de control și pot fi folosite ca declanșatoare de obiective.

Necesită scriptul complet (ca-events.js).

Semnătura API

window.ca(eventName, properties?);

Parametru	Tip	Descriere
`eventName`	string	Un nume descriptiv pentru eveniment (ex. 'signup', 'file_download').
`properties`	object	Obiect opțional cu metadate suplimentare. Serializat ca JSON.

Exemple

// Urmărește o înregistrare cu informații despre plan

window.ca('signup', { plan: 'pro' });

// Urmărește o descărcare de fișier

window.ca('file_download', {
  file_name: 'whitepaper.pdf',
  file_type: 'pdf',
});

// Urmărește o redare video

window.ca('video_play', {
  video_title: 'Product Demo',
  duration: 120,
});

// Urmărește o căutare internă

window.ca('search', { query: 'privacy analytics' });

Tracking de Obiective de Clic

Urmărește clicurile pe butoane și linkuri fără a scrie JavaScript. Adaugă un atribut data-ca-goal oricărui element HTML și clicul va fi înregistrat automat.

Necesită scriptul complet (ca-events.js).

Utilizare

Adaugă data-ca-goal="nume-obiectiv" oricărui element pe care se poate da clic. Valoarea atributului devine identificatorul obiectivului în panoul de control.

<button data-ca-goal="cta-signup">Sign Up</button>

<a href="/pricing" data-ca-goal="pricing-click">View Pricing</a>

<form data-ca-goal="contact-form-submit">
  <!-- The goal fires when any element inside is clicked -->
  <button type="submit">Send</button>
</form>

Cum funcționează

Scriptul folosește delegarea evenimentelor pe document pentru a detecta clicurile eficient:

Un eveniment de clic se declanșează oriunde pe pagină.
Scriptul parcurge arborele DOM de la elementul pe care s-a dat clic în sus, căutând un atribut data-ca-goal.
Dacă este găsit, trimite un eveniment de clic cu numele obiectivului ca selector.

Vizualizarea Obiectivelor de Clic

Evenimentele de obiective de clic apar pe pagina Obiective din panoul de control. Creează un obiectiv cu tipul «Clic» și potrivește-l cu valoarea data-ca-goal folosită în HTML.

Integrare GA4 DataLayer

Dacă site-ul tău trimite deja evenimente către Google Analytics dataLayer, ClearAnalytics poate intercepta acele evenimente automat. Aceasta este cea mai ușoară cale de migrare de la GA4.

Necesită scriptul complet (ca-events.js).

Activarea Interceptării DataLayer

Adaugă atributul data-ca-datalayer la eticheta script. Această abordare opt-in asigură că funcția se activează doar când o activezi explicit.

<script defer src="https://clearanalytics.eu/js/ca-events.js" data-ca-datalayer></script>

Cum funcționează

Când este activat, scriptul interceptează toate apelurile dataLayer.push():

Evenimentele e-commerce recunoscute (purchase, add_to_cart, etc.) sunt transmise ca evenimente e-commerce.
Toate celelalte evenimente personalizate sunt transmise ca evenimente personalizate generice.
Evenimentele interne GTM (gtm.js, gtm.dom, gtm.load, etc.) sunt filtrate automat.
Intrările dataLayer existente sunt procesate la încărcarea paginii; trimiterile viitoare sunt interceptate în timp real.

Exemplu

// These dataLayer pushes are automatically captured
dataLayer.push({
  event: 'form_submit',
  form_id: 'contact',
  form_name: 'Contact Form',
});

dataLayer.push({
  event: 'video_start',
  video_title: 'Product Demo',
  video_duration: 120,
});

Evenimente Ignorate

Următoarele evenimente interne GTM sunt ignorate automat și nu vor apărea în panoul de control:

// These GTM internal events are automatically filtered out:
gtm.js, gtm.dom, gtm.load, gtm.click, gtm.linkClick, gtm.scrollDepth

Tracking E-Commerce

Urmărește întregul parcurs al clientului de la navigarea produselor până la achiziție și rambursare. ClearAnalytics suportă toate cele 14 evenimente standard e-commerce folosind același format dataLayer ca GA4.

Necesită scriptul complet (ca-events.js) cu atributul data-ca-datalayer.

Toate evenimentele e-commerce folosesc formatul compatibil GA4 dataLayer.push(). Dacă ai deja tracking e-commerce GA4 implementat, ClearAnalytics va captura acele evenimente automat fără nicio modificare de cod.

Eveniment	Descriere
`view_item_list`	Utilizatorul vizualizează o listă de produse sau rezultate de căutare.
`select_item`	Utilizatorul dă clic pe un produs dintr-o listă.
`view_item`	Utilizatorul vizualizează o pagină de detalii produs.
`add_to_cart`	Utilizatorul adaugă un produs în coșul de cumpărături.
`remove_from_cart`	Utilizatorul elimină un produs din coș.
`view_cart`	Utilizatorul vizualizează coșul de cumpărături.
`add_to_wishlist`	Utilizatorul adaugă un produs pe lista de dorințe.
`begin_checkout`	Utilizatorul începe procesul de finalizare a comenzii.
`add_shipping_info`	Utilizatorul trimite informațiile de livrare.
`add_payment_info`	Utilizatorul trimite informațiile de plată.
`purchase`	Utilizatorul finalizează o achiziție.
`refund`	O rambursare totală sau parțială este procesată.
`view_promotion`	Utilizatorul vizualizează un banner sau o ofertă promoțională.
`select_promotion`	Utilizatorul dă clic pe o promoție.

view_item_list

Declanșează acest eveniment când utilizatorii văd o listă de produse, cum ar fi o pagină de categorie sau rezultate de căutare.

dataLayer.push({ ecommerce: null }); // Clear previous data
dataLayer.push({
  event: 'view_item_list',
  ecommerce: {
    item_list_id: 'category_results',
    item_list_name: 'Category Results',
    items: [
      {
        item_id: 'SKU-001',
        item_name: 'Running Shoes',
        item_brand: 'SportCo',
        item_category: 'Footwear',
        price: 89.99,
        index: 0,
      },
      {
        item_id: 'SKU-002',
        item_name: 'Trail Shoes',
        item_brand: 'SportCo',
        item_category: 'Footwear',
        price: 119.99,
        index: 1,
      },
    ],
  },
});

select_item

Declanșează acest eveniment când un utilizator dă clic pe un produs specific dintr-o listă pentru a-l vizualiza.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'select_item',
  ecommerce: {
    item_list_id: 'category_results',
    item_list_name: 'Category Results',
    items: [{
      item_id: 'SKU-001',
      item_name: 'Running Shoes',
      item_brand: 'SportCo',
      price: 89.99,
      index: 0,
    }],
  },
});

view_item

Declanșează acest eveniment când un utilizator ajunge pe o pagină de detalii produs.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'view_item',
  ecommerce: {
    currency: 'EUR',
    value: 89.99,
    items: [{
      item_id: 'SKU-001',
      item_name: 'Running Shoes',
      item_brand: 'SportCo',
      item_category: 'Footwear',
      item_variant: 'Blue / Size 42',
      price: 89.99,
      quantity: 1,
    }],
  },
});

add_to_cart

Declanșează acest eveniment când un utilizator adaugă unul sau mai multe produse în coșul de cumpărături.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'add_to_cart',
  ecommerce: {
    currency: 'EUR',
    value: 89.99,
    items: [{
      item_id: 'SKU-001',
      item_name: 'Running Shoes',
      item_brand: 'SportCo',
      price: 89.99,
      quantity: 1,
    }],
  },
});

remove_from_cart

Declanșează acest eveniment când un utilizator elimină un produs din coș.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'remove_from_cart',
  ecommerce: {
    currency: 'EUR',
    value: 89.99,
    items: [{
      item_id: 'SKU-001',
      item_name: 'Running Shoes',
      price: 89.99,
      quantity: 1,
    }],
  },
});

view_cart

Declanșează acest eveniment când un utilizator vizualizează pagina coșului de cumpărături.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'view_cart',
  ecommerce: {
    currency: 'EUR',
    value: 209.98,
    items: [
      { item_id: 'SKU-001', item_name: 'Running Shoes', price: 89.99, quantity: 1 },
      { item_id: 'SKU-003', item_name: 'Sports Watch', price: 119.99, quantity: 1 },
    ],
  },
});

add_to_wishlist

Declanșează acest eveniment când un utilizator salvează un produs pe lista de dorințe pentru mai târziu.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'add_to_wishlist',
  ecommerce: {
    currency: 'EUR',
    value: 89.99,
    items: [{
      item_id: 'SKU-001',
      item_name: 'Running Shoes',
      price: 89.99,
    }],
  },
});

begin_checkout

Declanșează acest eveniment când un utilizator începe fluxul de finalizare a comenzii.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'begin_checkout',
  ecommerce: {
    currency: 'EUR',
    value: 209.98,
    coupon: 'SUMMER20',
    items: [
      { item_id: 'SKU-001', item_name: 'Running Shoes', price: 89.99, quantity: 1 },
      { item_id: 'SKU-003', item_name: 'Sports Watch', price: 119.99, quantity: 1 },
    ],
  },
});

add_shipping_info

Declanșează acest eveniment când un utilizator selectează sau trimite detaliile de livrare în timpul finalizării comenzii.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'add_shipping_info',
  ecommerce: {
    currency: 'EUR',
    value: 209.98,
    shipping_tier: 'Express',
    items: [
      { item_id: 'SKU-001', item_name: 'Running Shoes', price: 89.99, quantity: 1 },
      { item_id: 'SKU-003', item_name: 'Sports Watch', price: 119.99, quantity: 1 },
    ],
  },
});

add_payment_info

Declanșează acest eveniment când un utilizator selectează sau trimite metoda de plată în timpul finalizării comenzii.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'add_payment_info',
  ecommerce: {
    currency: 'EUR',
    value: 209.98,
    payment_type: 'Credit Card',
    items: [
      { item_id: 'SKU-001', item_name: 'Running Shoes', price: 89.99, quantity: 1 },
      { item_id: 'SKU-003', item_name: 'Sports Watch', price: 119.99, quantity: 1 },
    ],
  },
});

purchase

Declanșează acest eveniment când o achiziție este confirmată. Include transaction_id, value, currency, tax, shipping și array-ul complet items.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'purchase',
  ecommerce: {
    transaction_id: 'TXN-20260219-001',
    affiliation: 'Online Store',
    value: 209.98,
    tax: 36.49,
    shipping: 5.99,
    currency: 'EUR',
    coupon: 'SUMMER20',
    items: [
      {
        item_id: 'SKU-001',
        item_name: 'Running Shoes',
        item_brand: 'SportCo',
        item_category: 'Footwear',
        item_variant: 'Blue / Size 42',
        price: 89.99,
        quantity: 1,
        coupon: '',
      },
      {
        item_id: 'SKU-003',
        item_name: 'Sports Watch',
        item_brand: 'FitTech',
        item_category: 'Electronics',
        item_variant: 'Black',
        price: 119.99,
        quantity: 1,
        coupon: '',
      },
    ],
  },
});

refund

Declanșează acest eveniment când o rambursare este procesată. Pentru o rambursare totală, doar transaction_id este necesar. Pentru rambursări parțiale, include articolele specifice.

// Full refund
dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'refund',
  ecommerce: {
    transaction_id: 'TXN-20260219-001',
  },
});

// Partial refund (specific items)
dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'refund',
  ecommerce: {
    transaction_id: 'TXN-20260219-001',
    items: [{
      item_id: 'SKU-001',
      quantity: 1,
    }],
  },
});

view_promotion

Declanșează acest eveniment când un banner promoțional, carusel sau ofertă devine vizibil pentru utilizator.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'view_promotion',
  ecommerce: {
    creative_name: 'Spring Banner',
    creative_slot: 'homepage_hero',
    promotion_id: 'PROMO-SPRING-2026',
    promotion_name: 'Spring Sale 2026',
    items: [{
      item_id: 'SKU-001',
      item_name: 'Running Shoes',
      price: 89.99,
      discount: 15.00,
    }],
  },
});

select_promotion

Declanșează acest eveniment când un utilizator dă clic pe o promoție pentru a afla mai multe sau a profita de ofertă.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'select_promotion',
  ecommerce: {
    creative_name: 'Spring Banner',
    creative_slot: 'homepage_hero',
    promotion_id: 'PROMO-SPRING-2026',
    promotion_name: 'Spring Sale 2026',
    items: [{
      item_id: 'SKU-001',
      item_name: 'Running Shoes',
      price: 89.99,
    }],
  },
});

Migrarea de la Google Analytics

ClearAnalytics este conceput să funcționeze alături de sau ca înlocuitor pentru Google Analytics. Poți rula ambele instrumente în paralel în timpul migrării fără conflicte.

Rularea ambelor scripturi în paralel

Adaugă scriptul ClearAnalytics alături de eticheta ta existentă Google Analytics. Ambele scripturi vor urmări independent fără a interfera unul cu celălalt.

<!-- Google Analytics (existing) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXX');
</script>

<!-- ClearAnalytics (add this line) -->
<script defer src="https://clearanalytics.eu/js/ca-events.js" data-ca-datalayer></script>

Compatibilitate funcții

Iată cum se potrivesc funcțiile ClearAnalytics cu echivalentele lor din Google Analytics:

Funcție	Google Analytics	ClearAnalytics
Vizualizări de pagină	`gtag('event', 'page_view')`	Automat
Evenimente personalizate	`gtag('event', ...)`	`window.ca('event')`
E-Commerce	`dataLayer.push()`	compatibil dataLayer
Campanii UTM	Automat	Automat
Sesiuni	Bazat pe cookie-uri	Fără cookie-uri

Pașii migrării

Adaugă scriptul ClearAnalytics pe site-ul tău alături de Google Analytics.
Activează interceptarea dataLayer cu data-ca-datalayer pentru a captura evenimentele e-commerce existente.
Compară datele în ambele panouri de control timp de 2-4 săptămâni pentru a verifica acuratețea.
Odată satisfăcut, elimină scriptul Google Analytics și bucură-te de o configurare mai rapidă, orientată spre confidențialitate.

Suport SPA

ClearAnalytics detectează automat navigarea pe partea de client în aplicațiile single-page. Nu este necesară nicio configurare suplimentară sau integrare cu routerul.

Cum funcționează

Scriptul interceptează apelurile browser-ului History API pentru a detecta navigarea paginilor:

history.pushState() apelurile sunt interceptate și declanșează o nouă vizualizare de pagină.
history.replaceState() apelurile sunt interceptate și declanșează o nouă vizualizare de pagină.
popstate evenimentele (înapoi/înainte în browser) declanșează o nouă vizualizare de pagină.

Framework-uri compatibile

Funcționează imediat cu orice framework care folosește History API pentru rutare:

React Next.js Vue.js Nuxt Svelte SvelteKit Angular Remix Astro Inertia.js

Nu sunt necesare pluginuri de router, hook-uri de ciclu de viață sau apeluri manuale de tracking. Adaugă eticheta script o singură dată și fiecare navigare de pagină este urmărită automat.

Confidențialitate și Conformitate

ClearAnalytics este construit cu confidențialitatea în centru. Scriptul de tracking colectează doar date anonime și agregate. Nicio informație personală nu este vreodată stocată sau transmisă.

Fără Cookie-uri

Scriptul nu setează, citește sau depinde de niciun cookie de browser. Nu este necesar niciun banner de consimțământ pentru cookie-uri.

Fără Amprentare Digitală

Nu creăm niciodată amprente digitale ale browserului. Nu sunt folosite tehnici de amprentare canvas, WebGL, fonturi sau audio.

Fără Stocare IP

Adresele IP ale vizitatorilor sunt folosite doar pentru hashing anonim în timpul cererii. Nu sunt niciodată stocate în baza de date.

Conform GDPR

Deoarece nu sunt colectate date personale, ClearAnalytics nu intră sub incidența cerințelor de consimțământ GDPR. Toate datele rămân în UE.

Cum anonimizăm vizitatorii

Pentru a număra vizitatorii unici fără a stoca date personale, folosim un hash anonim cu rotație zilnică:

Adresa IP a vizitatorului și User-Agent sunt combinate cu un salt cu rotație zilnică.
Această combinație este hashată folosind un algoritm SHA-256 unidirecțional.
Salt-ul se rotește la fiecare 24 de ore, făcând imposibilă urmărirea vizitatorilor între zile.
Adresa IP originală nu este niciodată stocată sau înregistrată.

Date colectate de script

Următoarele câmpuri de date non-personale sunt trimise cu fiecare eveniment de vizualizare a paginii:

Câmp	Scop
`pathname`	Calea URL a paginii vizitate.
`referrer`	URL-ul paginii de referință, dacă există.
`language`	Setarea de limbă a browserului.
`screen_width / screen_height`	Dimensiunile ecranului pentru clasificarea tipului de dispozitiv.
`utm_*`	Parametrii de urmărire a campaniei din URL.
`duration`	Timpul petrecut pe pagină în secunde.

Deoarece ClearAnalytics nu colectează niciodată date personale, nu ai nevoie de un banner de consimțământ pentru cookie-uri, popup de confidențialitate sau mecanism opt-in pentru a folosi scriptul nostru de tracking. Este conform cu GDPR, ePrivacy, PECR și CCPA din start.