TKTrackkit
SPA demo

SPA Page Alpha

This section should fire content_in_viewport when you arrive here via client navigation from the SPA demo hub.

Back to hubGo to Page Beta
Viewport

Tracked section on this route

Scroll this card into view or land on this page from another SPA route. You should see content_in_viewport with content.name set to SPA Page Alpha Card.

SPA route refresh
// components/TrackKitRouteRefresh.tsx
"use client";

import { useTrackKitRouteRefresh } from "nextjs-trackkit/react";

export function TrackKitRouteRefresh() {
  useTrackKitRouteRefresh();
  return null;
}

// app/providers.tsx
"use client";

import { TrackKitProvider } from "nextjs-trackkit/react";
import { TrackKitRouteRefresh } from "@/components/TrackKitRouteRefresh";

export function Providers({ children }: { children: React.ReactNode }) {
  return (
    <TrackKitProvider gtmId={process.env.NEXT_PUBLIC_GTM_ID}>
      <TrackKitRouteRefresh />
      {children}
    </TrackKitProvider>
  );
}

Live dataLayer

No events yet.