mean-weasel · neonwatty · May 13, 2026 · May 13, 2026
diff --git a/src/app/compare/[slug]/page.tsx b/src/app/compare/[slug]/page.tsx
@@ -71,6 +71,8 @@ export default async function ComparePage({
             href={MARKETPLACE_URL}
             target="_blank"
             rel="noopener noreferrer"
+            data-analytics-event="compare_marketplace_click"
+            data-analytics-label={comparison.title}
             className="inline-flex items-center gap-2 px-6 py-3 rounded-[10px] font-medium bg-gradient-to-br from-accent-warm to-accent-rose text-bg-deep hover:-translate-y-0.5 transition-all duration-300"
           >
             Install from GitHub Marketplace

diff --git a/src/app/compare/page.tsx b/src/app/compare/page.tsx
@@ -40,6 +40,8 @@ export default function CompareIndex() {
           <Link
             key={c.slug}
             href={`/compare/${c.slug}`}
+            data-analytics-event="compare_index_click"
+            data-analytics-label={c.title}
             className="bg-bg-surface border border-border rounded-2xl p-7 transition-all duration-300 hover:-translate-y-1 hover:border-accent-warm hover:shadow-[0_20px_40px_rgba(0,0,0,0.3)] no-underline"
           >
             <h2 className="text-lg font-semibold text-text-primary mb-2">{c.title}</h2>

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -3,6 +3,7 @@ import { Space_Grotesk, JetBrains_Mono } from "next/font/google";
 import "./globals.css";
 import { Nav } from "@/components/nav";
 import { Footer } from "@/components/footer";
+import { Analytics } from "@/components/analytics";
 import { homeDescription } from "@/lib/seo";
 
 const spaceGrotesk = Space_Grotesk({
@@ -54,6 +55,7 @@ export default function RootLayout({
   return (
     <html lang="en" className={`${spaceGrotesk.variable} ${jetbrainsMono.variable}`}>
       <body>
+        <Analytics />
         <div className="bg-atmosphere" />
         <Nav />
         <div className="max-w-[1100px] mx-auto px-8 py-16 max-sm:px-4 max-sm:py-8">

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -5,13 +5,16 @@ import { HowItWorks } from "@/components/landing/how-it-works";
 import { LiveDemoCta } from "@/components/landing/live-demo-cta";
 import { DemoVideo } from "@/components/landing/demo-video";
 import { Features } from "@/components/landing/features";
+import { KeywordPositioning } from "@/components/landing/keyword-positioning";
 import { StylingShowcase } from "@/components/landing/styling-showcase";
 import { QuickStart } from "@/components/landing/quick-start";
 import { ConfigTable } from "@/components/landing/config-table";
 import { TryCallout } from "@/components/landing/try-callout";
 import { JsonLd } from "@/components/json-ld";
 import {
+  homeDescription,
   organizationSchema,
+  pageMetadata,
   softwareApplicationSchema,
   websiteSchema,
 } from "@/lib/seo";
@@ -21,6 +24,25 @@ import {
 } from "@/lib/links";
 
 export const metadata: Metadata = {
+  ...pageMetadata({
+    title: "Free Website Feedback Widget for GitHub Issues | BugDrop",
+    description: homeDescription,
+    path: "/",
+  }),
+  keywords: [
+    "website feedback widget",
+    "GitHub Issues feedback widget",
+    "visual bug reporting tool",
+    "bug reporting widget",
+    "open source feedback widget",
+    "screenshot feedback widget",
+    "Userback alternative",
+    "Marker.io alternative",
+    "BugHerd alternative",
+    "Usersnap alternative",
+    "Sentry User Feedback alternative",
+    "Canny alternative for bug reports",
+  ],
   alternates: {
     canonical: "/",
   },
@@ -53,6 +75,7 @@ export default function Home() {
       <HowItWorks />
       <LiveDemoCta />
       <Features />
+      <KeywordPositioning />
       <StylingShowcase />
       <QuickStart />
       <ConfigTable />

diff --git a/src/app/sandbox/page.tsx b/src/app/sandbox/page.tsx
@@ -0,0 +1,19 @@
+import type { Metadata } from "next";
+import { WidgetSandbox } from "@/components/sandbox/widget-sandbox";
+import { pageMetadata } from "@/lib/seo";
+
+export const metadata: Metadata = {
+  ...pageMetadata({
+    title: "BugDrop Sandbox | Configure and Preview the Feedback Widget",
+    description:
+      "Configure BugDrop's feedback widget, preview styling and screenshot behavior, and generate the script tag for your own app.",
+    path: "/sandbox",
+  }),
+  alternates: {
+    canonical: "/sandbox",
+  },
+};
+
+export default function SandboxPage() {
+  return <WidgetSandbox />;
+}
diff --git a/src/app/sitemap.ts b/src/app/sitemap.ts
@@ -29,9 +29,14 @@ export default function sitemap(): MetadataRoute.Sitemap {
       url: `${base}/use-cases/${useCase.slug}`,
       lastModified,
       changeFrequency: "monthly" as const,
-      priority: ["github-issues-feedback", "visual-bug-reporting", "nextjs-feedback-widget"].includes(
-        useCase.slug,
-      )
+      priority: [
+        "github-issues-feedback",
+        "website-feedback-widget",
+        "free-website-feedback-widget",
+        "screenshot-feedback-widget",
+        "visual-bug-reporting",
+        "nextjs-feedback-widget",
+      ].includes(useCase.slug)
         ? 0.8
         : 0.6,
     })),

diff --git a/src/app/use-cases/[slug]/page.tsx b/src/app/use-cases/[slug]/page.tsx
@@ -71,6 +71,8 @@ export default async function UseCasePage({
             href={MARKETPLACE_URL}
             target="_blank"
             rel="noopener noreferrer"
+            data-analytics-event="use_case_marketplace_click"
+            data-analytics-label={useCase.title}
             className="inline-flex items-center gap-2 px-6 py-3 rounded-[10px] font-medium bg-gradient-to-br from-accent-warm to-accent-rose text-bg-deep hover:-translate-y-0.5 transition-all duration-300"
           >
             Install from GitHub Marketplace

diff --git a/src/app/use-cases/page.tsx b/src/app/use-cases/page.tsx
@@ -41,6 +41,8 @@ export default function UseCasesIndex() {
           <Link
             key={uc.slug}
             href={`/use-cases/${uc.slug}`}
+            data-analytics-event="use_case_index_click"
+            data-analytics-label={uc.title}
             className="bg-bg-surface border border-border rounded-2xl p-7 transition-all duration-300 hover:-translate-y-1 hover:border-accent-warm hover:shadow-[0_20px_40px_rgba(0,0,0,0.3)] no-underline"
           >
             <span className="text-3xl mb-4 block">{uc.icon}</span>