From 39cb63b4bb815cb0894576fbc843c3cab2372131 Mon Sep 17 00:00:00 2001 From: Jackson Date: Fri, 6 Mar 2026 16:11:34 -0800 Subject: [PATCH 01/16] Add site rewrite plan and simplify CLAUDE.md Comprehensive plan doc covering 9 workstreams: site architecture, content strategy, page CRO, email sequence, AI SEO, launch strategy, schema markup, analytics tracking, and copywriting decisions. CLAUDE.md slimmed to point at plan doc with work discipline rules (commit after every task, keep plan doc current). Co-Authored-By: Claude Opus 4.6 --- CLAUDE.md | 200 +++---------------- docs/site-rewrite-plan.md | 400 ++++++++++++++++++++++++++++++++++++++ 2 files changed, 426 insertions(+), 174 deletions(-) create mode 100644 docs/site-rewrite-plan.md diff --git a/CLAUDE.md b/CLAUDE.md index db12f44..6b75ae9 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -2,202 +2,54 @@ Astro 5 → channel47.dev via Vercel. Static output + one serverless endpoint (`api/subscribe.ts`). -## Commands - -```bash -npm run dev # localhost:4321+ -npm run build -npm run preview # Preview build output locally -npm test # node --test -``` - -Tests use `node:test` (no framework). Test files in `tests/`. - -## Strategy Docs - -- `.claude/product-marketing-context.md` — single source of truth for positioning, competitive landscape, audience, differentiation, messaging, voice, proof points, metrics - -## Environment - -`KIT_API_KEY` required for subscribe endpoint. `PUBLIC_GA_*` / `PUBLIC_META_*` for analytics. - -## Plugins (current state) - -Install commands: -- Marketplace: `claude plugin marketplace add channel47` (homepage hero CTA) -- Individual: `claude plugin install google-ads@channel47` (plugin detail pages) - -Three live plugins, one deprecated: - -| Plugin | Status | Workflows | Content file | -|--------|--------|----------:|-------------| -| google-ads | Live v1.0.0 | 9 | `src/content/tools/plugins/google-ads.md` | -| microsoft-ads | Live v1.0.0 | 8 | `src/content/tools/plugins/microsoft-ads.md` | -| meta-ads | Live v1.0.0 | 9 + 2 agents | `src/content/tools/plugins/meta-ads.md` | -| paid-search | Deprecated (frozen v7.0.0) | 6 | `src/content/tools/plugins/paid-search.md` | -| frontend-craft | Not marketed | — | `src/content/tools/plugins/frontend-craft.md` | - - -## Pages +**Status: Rewrite in progress.** See `docs/site-rewrite-plan.md` for the full plan. -- `/` — Homepage: "Claude plugins for paid media" (hero with marketplace install CTA + proof bar + plugin directory + credibility + workshop + FAQ + rupture + product callout + CTA) -- `/plugins/` — Plugins hub — filtered listing of featured plugins (excludes deprecated/unmarketable). Targets "claude code plugins", "claude plugin marketplace" -- `/plugins/[slug]` — Plugin detail page with rendered markdown body, schema (SoftwareApplication + BreadcrumbList + HowTo) -- `/guides/` — Guides hub — SEO content hub for practitioner guides. Targets "google ads ai tool", "ai ppc management" -- `/guides/[slug]` — Individual guide articles (Article + BreadcrumbList schema). Categories: setup, workflow, comparison, overview -- `/notes` — Build Notes hub (content collection index, newsletter community content) -- `/notes/[slug]` — Individual note articles (Article + BreadcrumbList schema) -- `/labs` — Skills Labs landing page (monthly live builds → Skool community) -- `/subscribe` — Email signup standalone page -- `/privacy` — Privacy policy -- `/coming-soon` — Shared empty state with email signup -- `/skills/` — 301 redirect to `/plugins` -- `/skills/[slug]` — Skill detail page (legacy, still live for direct links, excluded from sitemap) -- `/mcps/` — 301 redirect to `/plugins` -- `/mcps/[slug]` — MCP detail page (legacy, still live for direct links, excluded from sitemap) -- `/build`, `/tools`, `/ecosystem`, `/hire` — 301 redirects to `/` -- `/api/subscribe` — POST, proxies to Kit API +## Work Discipline -## Content Sections +- **Commit after every completed task.** Don't batch. Each turn that changes files should end with a commit. +- **Update `docs/site-rewrite-plan.md`** when a task is completed, modified, or removed. Keep the plan doc current — it's the source of truth for what's done and what's left. +- Read the plan doc at the start of every session before making changes. -| Section | Purpose | SEO role | -|---------|---------|----------| -| `/plugins/` | Product hub — the plugins | Targets "claude code plugins", "claude plugin marketplace" | -| `/guides/` | SEO content hub — keyword-targeted how-to guides | Captures search intent: setup, workflows, comparisons | -| `/notes/` | Community content — Build Notes newsletter | Community/newsletter, not SEO-optimized | +## Plan Doc -### Guides content collection +`docs/site-rewrite-plan.md` — covers site architecture, content strategy, page CRO, email sequence, AI SEO, launch strategy, schema markup, analytics tracking, and copywriting decisions. **Read this first.** -Guides live in `src/content/guides/`. Schema: title, description, date, updated, category (setup/workflow/comparison/overview), plugin (optional related plugin slug), featured, draft. Guide detail pages reuse the article layout pattern from notes with reading progress bar. - -**Phase 1 guides (live):** -- `claude-for-ppc.md` — Pillar page. Targets "claude for google ads", "ai ppc management" -- `connect-google-ads-to-claude.md` — Setup guide. Targets "connect google ads to claude", "google ads mcp claude" -- `morning-brief-workflow.md` — Workflow guide. Targets "google ads morning brief" - -**Phase 2 guides (planned):** -- `waste-detection-google-ads.md` — Workflow guide -- `search-term-analysis.md` — Workflow guide -- `claude-prompts-google-ads.md` — Competes with Adspirer's blog post (they rank #16) -- `connect-meta-ads-to-claude.md` — Setup guide -- `connect-microsoft-ads-to-claude.md` — Setup guide - -**Phase 3 guides (planned):** -- `best-ai-tools-google-ads.md` — Listicle/comparison -- `ai-ppc-management.md` — Broad category guide - -## Navigation - -Header: Plugins · Guides · Notes · Labs · Subscribe -Footer: Plugins · Guides · Notes · Labs · Privacy · jackson attribution - -## Sitemap +## Strategy Docs -16 URLs in sitemap. Excluded via `astro.config.mjs` filter: `/skills/*`, `/mcps/*`, `/tools/*`, `/plugins/paid-search`, `/plugins/frontend-craft`, `/coming-soon`, redirect pages. +- `../.claude/product-marketing-context.md` — positioning, audience, voice, competitive landscape +- `../plugins/product-marketing-context.md` — plugin-specific positioning -## Key Files +## Commands +```bash +npm run dev # localhost:4321+ +npm run build +npm run preview +npm test # node --test ``` -src/ -├── layouts/ -│ └── BaseLayout.astro # Root layout (meta, fonts, schema, scroll reveal) -├── pages/ -│ ├── index.astro # Homepage -│ ├── plugins/index.astro # Plugins hub — filtered listing (featured only) -│ ├── plugins/[slug].astro # Plugin detail (renders Content via slot) -│ ├── guides/index.astro # Guides hub — SEO content listing -│ ├── guides/[...slug].astro # Guide detail (article layout with reading progress) -│ ├── skills/[slug].astro # Skill detail (legacy, renders Content via slot) -│ ├── mcps/[slug].astro # MCP detail (legacy, renders Content via slot) -│ ├── notes/index.astro # Build Notes hub -│ ├── notes/[...slug].astro # Article page -│ ├── labs.astro # Skills Labs -│ ├── subscribe.astro # Email signup -│ ├── privacy.astro # Privacy policy -│ ├── coming-soon.astro # Empty state -│ └── api/subscribe.ts # Kit API proxy (serverless) -├── components/ -│ ├── Nav.astro # Fixed glass nav (Plugins · Guides · Notes · Labs · Subscribe) -│ ├── Footer.astro # Plugins · Guides · Notes · Labs · Privacy + attribution -│ ├── Breadcrumbs.astro # Breadcrumb navigation -│ ├── EmailSignup.astro # Email capture form (JS state handling) -│ ├── ContentCard.astro # Note card for grid -│ ├── ToolCard.astro # Full-width tool row -│ ├── ToolDetail.astro # Tool detail layout with slot for markdown body + prose styles -│ ├── ProductCallout.astro # PaidBrief callout card -│ ├── LogoAnimated.astro # Animated channel47 logo -│ ├── ui/button.tsx # shadcn/ui Button (React) -│ └── ui/input.tsx # shadcn/ui Input (React) -├── content/ -│ ├── guides/ # Practitioner guides (markdown, `guides` collection — SEO content) -│ ├── notes/ # Published notes (markdown, `notes` collection — newsletter content) -│ ├── tools/ # Tool registry (markdown with YAML frontmatter, `tools` collection) -│ │ ├── plugins/ # google-ads, microsoft-ads, meta-ads, paid-search, frontend-craft -│ │ ├── skills/ # morning-brief, waste-detector, search-term-verdict, pmax-decoder, platform-setup, gaql -│ │ └── mcps/ # google-ads-mcp, bing-ads-mcp -│ └── newsletters/ # Newsletter drafts (markdown) -├── styles/ -│ └── main.css # Tailwind v4 @theme tokens, @layer components, keyframes -└── scripts/ - ├── scroll-reveal.ts # IntersectionObserver scroll reveal - ├── nav-scroll.ts # Nav hide-on-scroll behavior - └── copy-to-clipboard.ts # Copy button utility -``` - -## Schema (structured data) - -BaseLayout accepts a `schema` prop → renders JSON-LD. Currently deployed: -- **Homepage**: Organization + WebSite + FAQPage -- **Plugin detail pages**: SoftwareApplication + BreadcrumbList + HowTo -- **Plugins hub**: BreadcrumbList + ItemList -- **Guides hub**: BreadcrumbList + ItemList -- **Guide articles**: Article + BreadcrumbList -- **Notes articles**: Article + BreadcrumbList -## Subscribe API - -`POST /api/subscribe` proxies to Kit. Accepts JSON or form-encoded. +## Environment -- `email` (required) — subscriber email -- `tag` (optional) — applies a Kit tag prefixed `ch47-` (e.g., `"home"` → `ch47-home`) -- `fields` (optional) — custom Kit fields. Allowed keys: `name`, `scope`, `brief`, `budget`, `build_role`, `build_task`, `build_tool` +`KIT_API_KEY` for subscribe endpoint. `PUBLIC_GA_*` / `PUBLIC_META_*` for analytics. ## CSS -Tailwind CSS v4 via `@tailwindcss/vite`. Single entry point: `src/styles/main.css`. - -- `@theme` block defines the design token system: warm gray scale, amber accent, font families, radius, animations -- `@layer components` for shared patterns: `.label`, `.wrap`, `.prose`, `.hero`, `.stats`, `.cta`, `.accent-bar` -- Scoped ` diff --git a/src/pages/index.astro b/src/pages/index.astro index 344306b..c288b41 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -1,334 +1,516 @@ --- -/** - * Homepage — AI plugins for media buyers. - * - * Density: LOW (hero) → HIGH (proof bar) → HIGH (plugin directory) → - * MEDIUM (credibility) → MEDIUM (workshop callout) → - * RUPTURE → MEDIUM (product) → LOW (CTA void) - */ -import { getCollection } from 'astro:content'; import BaseLayout from '../layouts/BaseLayout.astro'; -import Nav from '../components/Nav.astro'; -import Footer from '../components/Footer.astro'; +import LogoAnimated from '../components/LogoAnimated.astro'; import EmailSignup from '../components/EmailSignup.astro'; -import ProductCallout from '../components/ProductCallout.astro'; -import ToolCard from '../components/ToolCard.astro'; - -const SKOOL_LINK = 'https://www.skool.com/the-vibe-marketers/about?ref=a005b4a2e4e9420e814a94e5e1c2e708'; - -const allTools = await getCollection('tools'); -const plugins = allTools.filter(t => t.data.type === 'plugin' && t.data.featured); -const skills = allTools.filter(t => t.data.type === 'skill'); - -const faqs = [ - { - q: 'What is Channel 47?', - a: 'Channel 47 builds free, open-source Claude plugins for paid media. One plugin per ad platform — Google Ads, Microsoft Ads, and Meta Ads. Each plugin connects Claude to your live account data and runs practitioner-built workflows for morning briefs, waste detection, and search term analysis. Built by Jackson Dean from managing 25+ ad accounts daily.', - }, - { - q: "What's the difference between a workflow and a plugin?", - a: 'A workflow is a single, focused AI task — install it and run it today. A plugin bundles multiple workflows and account connections into one package for a specific ad platform. Workflows are the entry point. Plugins are the depth layer.', - }, - { - q: 'Are Channel 47 plugins free?', - a: 'Yes. All Channel 47 plugins are free and open source (MIT license). Three plugins are live: Google Ads (9 workflows), Microsoft Ads (8 workflows), and Meta Ads (9 workflows + 2 agents). PaidBrief, a commercial product built from the same ecosystem, is available separately at paidbrief.com.', - }, - { - q: 'What ad platforms does Channel 47 support?', - a: 'Channel 47 has three live plugins: Google Ads (9 workflows including waste detection and Performance Max transparency), Microsoft Ads (8 workflows including import auditing and MSAN cleanup), and Meta Ads (9 workflows + 2 agents for creative analysis and audience diagnostics). All read-only by design.', - }, - { - q: 'How do I install a plugin?', - a: 'In Claude Code, run: claude plugin install google-ads@channel47 (or microsoft-ads@channel47, or meta-ads@channel47). Then run the platform-setup workflow to configure your credentials and verify API access.', - }, -]; - -const schema = [ - { - '@type': 'Organization', - 'name': 'Channel 47', - 'url': 'https://channel47.dev', - 'logo': 'https://channel47.dev/logo-square.png', - 'description': 'Free, open-source Claude plugins for paid media — Google Ads, Microsoft Ads, and Meta Ads. 26 practitioner-built workflows for morning briefs, waste detection, and search term analysis. Read-only by design.', - 'founder': { - '@type': 'Person', - 'name': 'Jackson Dean', - 'url': 'https://x.com/ctrlswing', - 'jobTitle': 'Marketer & Plugin Builder', - }, - 'sameAs': [ - 'https://github.com/channel47', - 'https://x.com/ctrlswing', - ], - }, - { - '@type': 'WebSite', - 'name': 'Channel 47', - 'url': 'https://channel47.dev', - }, - { - '@type': 'FAQPage', - 'mainEntity': faqs.map(f => ({ - '@type': 'Question', - 'name': f.q, - 'acceptedAnswer': { - '@type': 'Answer', - 'text': f.a, - }, - })), - }, -]; --- - -