Add PostHog analytics — full event tracking across all pages

Tracks pageviews, hero/CTA clicks, product teaser clicks, app card
and detail views, newsletter signups, nav interactions, and footer
link clicks with structured properties for PostHog dashboards.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Tim Leikauf
2026-07-01 20:59:29 +02:00
parent 7f67d123d6
commit 0101447d84
14 changed files with 248 additions and 64 deletions

View File

@@ -1,10 +1,7 @@
import type { Metadata } from 'next'
import Link from 'next/link'
'use client'
export const metadata: Metadata = {
title: 'Shop HyggeCraftery',
description: 'Handgemachte Stücke für ein langsameres, schöneres Zuhause.',
}
import Link from 'next/link'
import { posthog } from '@/lib/posthog'
const products = [
{ name: 'Leinen-Kissen «Fjord»', price: '€ 48', desc: 'Sanftes Leinen in gedämpftem Salbei.', badge: 'Neu', bg: 'repeating-linear-gradient(40deg,#F0E8DA,#F0E8DA 11px,#E7DDCC 11px,#E7DDCC 22px)' },
@@ -46,7 +43,11 @@ export default function ShopPage() {
{/* Product grid */}
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(3,1fr)', gap: 30 }}>
{products.map((p) => (
<div key={p.name} style={{ display: 'block', color: 'inherit' }}>
<div
key={p.name}
onClick={() => posthog.capture('product_viewed', { product_name: p.name, price: p.price })}
style={{ display: 'block', color: 'inherit', cursor: 'pointer' }}
>
<div style={{ position: 'relative', height: 360, borderRadius: 30, overflow: 'hidden', background: p.bg, display: 'flex', alignItems: 'flex-end', justifyContent: 'center', padding: 18 }}>
{p.badge && (
<span style={{ position: 'absolute', top: 18, left: 18, background: p.badge === 'Bald' ? '#C4896A' : '#A8B89A', color: '#FAFAF7', fontSize: 11.5, fontWeight: 700, letterSpacing: 0.6, padding: '6px 13px', borderRadius: 30 }}>