feat: Implement analytics tracking with cookie consent and enhance SEO with backlink management.

This commit is contained in:
Timo Knuth
2026-02-09 16:07:39 +01:00
parent e871c820f7
commit f3774f3068
7 changed files with 264 additions and 69 deletions

View File

@@ -37,65 +37,65 @@ export default function CookieBanner() {
<>
{/* Cookie Banner - Bottom Left Corner */}
<div className="fixed bottom-4 left-4 z-50 max-w-md animate-slide-in">
<div className="bg-white rounded-lg shadow-2xl border border-gray-200 p-6">
<div className="flex items-start gap-3 mb-4">
<div className="flex-shrink-0">
<svg className="w-6 h-6 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
</svg>
</div>
<div>
<h3 className="text-base font-semibold text-gray-900 mb-2">
We use cookies
</h3>
<p className="text-gray-600 text-sm leading-relaxed mb-3">
We use essential cookies for authentication and analytics cookies to improve your experience.{' '}
<Link href="/privacy" className="text-primary-600 hover:text-primary-700 font-medium underline">
Learn more about our privacy policy
</Link>
</p>
<div className="bg-white rounded-lg shadow-2xl border border-gray-200 p-6">
<div className="flex items-start gap-3 mb-4">
<div className="flex-shrink-0">
<svg className="w-6 h-6 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
</svg>
</div>
<div>
<h3 className="text-base font-semibold text-gray-900 mb-2">
We use cookies
</h3>
<p className="text-gray-600 text-sm leading-relaxed mb-3">
We use essential cookies for authentication and analytics cookies to improve your experience.{' '}
<Link href="/privacy" className="text-primary-600 hover:text-primary-700 font-medium underline">
Learn more about our privacy policy
</Link>
</p>
{/* Cookie Categories */}
<div className="space-y-1.5 mb-4">
<div className="flex items-center text-xs">
<svg className="w-3.5 h-3.5 text-success-600 mr-1.5" fill="currentColor" viewBox="0 0 20 20">
<path fillRule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clipRule="evenodd" />
</svg>
<span className="text-gray-700"><strong>Essential:</strong> Authentication, CSRF protection</span>
</div>
<div className="flex items-center text-xs">
<svg className="w-3.5 h-3.5 text-primary-600 mr-1.5" fill="currentColor" viewBox="0 0 20 20">
<path fillRule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clipRule="evenodd" />
</svg>
<span className="text-gray-700"><strong>Analytics:</strong> PostHog for website analytics</span>
{/* Cookie Categories */}
<div className="space-y-1.5 mb-4">
<div className="flex items-center text-xs">
<svg className="w-3.5 h-3.5 text-success-600 mr-1.5" fill="currentColor" viewBox="0 0 20 20">
<path fillRule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clipRule="evenodd" />
</svg>
<span className="text-gray-700"><strong>Essential:</strong> Authentication, CSRF protection</span>
</div>
<div className="flex items-center text-xs">
<svg className="w-3.5 h-3.5 text-primary-600 mr-1.5" fill="currentColor" viewBox="0 0 20 20">
<path fillRule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clipRule="evenodd" />
</svg>
<span className="text-gray-700"><strong>Analytics:</strong> PostHog & Google Analytics</span>
</div>
</div>
</div>
</div>
{/* Actions */}
<div className="flex gap-2">
<Button
variant="outline"
onClick={handleDecline}
size="sm"
className="flex-1"
>
Decline
</Button>
<Button
variant="primary"
onClick={handleAccept}
size="sm"
className="flex-1"
>
Accept All
</Button>
</div>
</div>
</div>
{/* Actions */}
<div className="flex gap-2">
<Button
variant="outline"
onClick={handleDecline}
size="sm"
className="flex-1"
>
Decline
</Button>
<Button
variant="primary"
onClick={handleAccept}
size="sm"
className="flex-1"
>
Accept All
</Button>
</div>
</div>
</div>
<style jsx>{`
<style jsx>{`
@keyframes slide-in {
from {
transform: translateX(-100%);