Alle Integrationen

React / Vite

Ein Tag in index.html deckt die ganze App ab.

Schritte

  1. Öffnen Sie index.html im Projektstamm (Vite) oder public/index.html (Create React App).
  2. Fügen Sie das folgende Snippet im <head> ein. Ersetzen Sie SITE_ID durch Ihre Site-ID.
  3. Bauen Sie neu und deployen Sie.

Das Snippet

Ersetzen Sie SITE_ID durch die ID aus Ihren Glyphex-Website-Einstellungen.

<script defer src="https://glyphex.io/t/SITE_ID.js"></script>

SPA-Routing funktioniert automatisch. Glyphex erfasst History-Änderungen, daher laufen React Router, TanStack Router und ähnliche ohne zusätzlichen Code.

Funktion prüfen

Öffnen Sie Ihre Live-Website in einem neuen Tab und dann Echtzeit in Ihrem Glyphex-Dashboard. Ihr Besuch sollte nach wenigen Sekunden erscheinen.

Eigene Events erfassen

Rufen Sie window.analytics.track in einem beliebigen Handler auf:

export function SignupButton() {
  return (
    <button
      onClick={() =>
        window.analytics?.track("signup_click", { plan: "pro" })
      }
    >
      Sign up
    </button>
  );
}

Events lassen sich auch mit window.analytics.track(name, props) oder den deklarativen Attributen data-glyphex-event und data-glyphex-event-<prop> senden.

Fehlerbehebung

  • Keine Daten? Prüfen Sie, ob die Site-ID exakt stimmt und die Seite neu veröffentlicht bzw. der Cache geleert wurde.
  • Werbeblocker können Analytics-Scripts blockieren. Deaktivieren Sie Ihren zum Testen.
  • Content Security Policy: Erlauben Sie https://glyphex.io in script-src und connect-src.
  • Prüfen Sie in DevTools > Network auf eine Anfrage an glyphex.io/t/. Ein 404 bedeutet, dass die Site-ID falsch ist.

Eigene Events

Installation