Click-ID auslesen & speichern

Wenn du Events selbst sendest – aus einem eigenen Buchungssystem, einem selbst gebauten Formular oder deinem Backend –, verbindet die click_id jedes Event mit genau der Kampagne, dem Ad-Set und der Anzeige. Diese Seite zeigt, wo das Tracking-Script die Click-ID ablegt, alle Wege, sie auszulesen, und wie du diese Wege kombinierst, damit du die ID auch dann hast, wenn einer davon ausfällt.

Wo die Click-ID liegt

Kommt ein Besucher mit lj_click_id in der URL an (jeder getrackte Link trägt ihn), speichert das Tracking-Script diese ID. Ein Besucher ohne sie bekommt vom Script eine neue Click-ID. Auf jeder Seite, auf der das Script gelaufen ist, hat der Besucher also eine Click-ID – und sie liegt an mehreren Stellen gleichzeitig:

Wege, die Click-ID auszulesen

1. Die JavaScript-API (empfohlen)

Sobald das Script geladen ist, stellt es window.lj bereit:

const clickId = await window.lj.getClickId();

window.lj gibt es erst, nachdem das Script geladen ist. Stoppt ein Ad-Blocker oder ein Consent-Tool das Script oder ist es auf der Seite nicht installiert, ist window.lj undefined – deshalb greift das empfohlene Setup auf die anderen Wege zurück.

2. Browser-Speicher

Du kannst die gespeicherten Werte direkt auslesen. Das funktioniert auch dann, wenn das Script beim aktuellen Seitenaufruf blockiert ist – solange es bei einem früheren Besuch auf demselben Host gelaufen ist:

localStorage.getItem("clickId");
sessionStorage.getItem("clickId");
decodeURIComponent(document.cookie.match(/(?:^|; )clickId=([^;]*)/)?.[1] ?? "");

3. Ein Hidden Field im Formular

Füge deinem Formular ein verstecktes Feld hinzu – ganz ohne JavaScript. Das Script befüllt es automatisch mit der Click-ID:

<input type="hidden" name="lj_click_id" />

Das Script erkennt die Namen lj_click_id, lj_clickid, click_id und clickid (auch mit angehängtem _ und als form_fields[lj_click_id] für Elementor) sowie Felder, deren aria-label einer dieser Namen ist. Felder, die nach dem Laden dazukommen – ein späterer Schritt eines mehrstufigen Formulars, ein Widget, das spät rendert –, werden befüllt, sobald sie erscheinen. Setzt dein eigener Code den Wert zurück, rufe window.lj.mountClickId() auf, um ihn erneut zu befüllen.

4. Auf deinem Server: das Cookie clickId

Der Browser sendet das Cookie clickId bei jedem Request an denselben Host, auf dem das Script läuft. Schickt dein Buchungsformular an diesen Host, kann dein Server die ID ohne JavaScript auslesen:

// mit der Middleware cookie-parser
const clickId = req.cookies.clickId ?? null;

$clickId = $_COOKIE['clickId'] ?? null;

click_id = request.cookies.get("clickId")

Das Cookie gilt nur für den exakten Host. Ein Request von www.deinebrand.de an api.deinebrand.de trägt es nicht mit.

5. Aus der URL

Auf einer Seite ohne Tracking-Script kommt die Click-ID als ?lj_click_id=… an – zum Beispiel, wenn ein Besucher von deiner Website zu einem Buchungssystem auf einem anderen Host klickt. Sie steht nur in der URL dieser ersten Seite, also lies sie einmal beim Laden aus und hebe sie auf:

// Nur auf Seiten OHNE Tracking-Script – einmal beim Laden der Seite ausführen
const fromUrl = new URLSearchParams(window.location.search).get("lj_click_id");
if (fromUrl) {
  try {
    localStorage.setItem("clickId", fromUrl);
  } catch {}
}

Speicherst du sie unter clickId, findet der Helper unten sie genauso wie auf Seiten mit Script. Auf Seiten mit Script verlässt du dich nicht auf die URL: Das Script entfernt lj_click_id aus der Adresszeile, sobald es die ID gespeichert hat.

Das empfohlene Setup: kombinieren

Kein einzelner Weg funktioniert überall – Scripts werden blockiert, Formulare liegen auf anderen Subdomains, React-Formulare ignorieren Hidden Fields, und zwischen Buchung und nächstem Event liegen oft Tage. Kombiniere die Wege so, dass jeder die Lücken der anderen schließt.

// Gibt die LeadJourney-Click-ID des Besuchers zurück, oder null, wenn es keine gibt.
async function getClickId() {
  try {
    const id = await window.lj?.getClickId();
    if (id) return id;
  } catch {}

  const fallbacks = [
    () => localStorage.getItem("clickId"),
    () => decodeURIComponent(document.cookie.match(/(?:^|; )clickId=([^;]*)/)?.[1] ?? ""),
    () => sessionStorage.getItem("clickId"),
    () => new URLSearchParams(window.location.search).get("lj_click_id"),
  ];
  for (const read of fallbacks) {
    try {
      const id = read();
      if (id) return id;
    } catch {}
  }
  return null;
}

<form id="booking-form" method="post" action="/bookings">
  <!-- deine Felder: Name, E-Mail, Telefon, Termin … -->
  <input type="hidden" name="lj_click_id" />
</form>

<script>
  const form = document.getElementById("booking-form");
  form.addEventListener("submit", async (event) => {
    event.preventDefault();
    const field = form.elements.namedItem("lj_click_id");
    if (!field.value) field.value = (await getClickId()) ?? "";
    form.submit();
  });
</script>

bookingForm.addEventListener("submit", async (event) => {
  event.preventDefault();
  const data = Object.fromEntries(new FormData(bookingForm));

  await fetch("/api/bookings", {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({ ...data, click_id: await getClickId() }),
  });
});

const clickId =
  req.body.click_id || req.body.lj_click_id || req.cookies.clickId || null;

$clickId = null;
foreach ([$_POST['click_id'] ?? null, $_POST['lj_click_id'] ?? null, $_COOKIE['clickId'] ?? null] as $value) {
    if (!empty($value)) {
        $clickId = $value;
        break;
    }
}

click_id = (
    request.form.get("click_id")
    or request.form.get("lj_click_id")
    or request.cookies.get("clickId")
)

{
  "type": "BookedCall",
  "click_id": "8f3c2a1e-4b7d-4c1a-9e2f-6d5b3a7c9e10",
  "email": "[email protected]",
  "phone": "+491701234567",
  "first_name": "Anna",
  "last_name": "Schmidt"
}

Über Domains, Subdomains und iframes hinweg

Weil der Speicher zu einem Host gehört, muss die Click-ID in der URL reisen, sobald dein Buchungssystem woanders läuft als die Seite, auf der der Besucher gelandet ist.

getClickId().then((clickId) => {
  if (!clickId) return;
  document.querySelectorAll('a[href^="https://deinebuchung.de"]').forEach((link) => {
    const url = new URL(link.href);
    url.searchParams.set("lj_click_id", clickId);
    link.href = url.toString();
  });
});

<iframe id="booking" title="Termin buchen" width="100%" height="700"></iframe>

<script>
  getClickId().then((clickId) => {
    const src = new URL("https://deinebuchung.de/embed");
    if (clickId) src.searchParams.set("lj_click_id", clickId);
    document.getElementById("booking").src = src.toString();
  });
</script>

Prüfen, ob es funktioniert

1. Öffne deine Seite über einen getrackten Link – eine Test-Anzeigen-URL oder einen Link aus dem UTM Builder.
2. Öffne die Entwicklertools des Browsers und führe in der Console aus:

   await window.lj.getClickId();
   window.lj.getTrackingStatus();

   Unter Application → Local storage und Cookies findest du dieselbe ID als clickId.
3. Sende eine Testbuchung ab und prüfe, ob der Datensatz in deinem System die Click-ID hat.
4. Sende das Event und öffne das API-Postbacks-Log, um zu prüfen, ob es einem Klick zugeordnet wurde.

getTrackingStatus() gibt einen dieser Werte zurück:

FAQ

Verwandte Artikel