Blog
Blog — Podcast Show Page
Copy-paste layout brief covering Hero Section, Latest Episode, Episode List and Popular Episodes Section — hand it to ChatGPT, Claude, or v0 as-is.
Blog — Podcast Show Page is a copy-ready build prompt for blog pages. Paste it into ChatGPT, Claude, v0 and iterate from the first draft it returns.
We keep this entry in sync on a schedule, so the counts and the description track the upstream project.
| Use case | Blog |
|---|---|
| Works with | ChatGPT, Claude, v0, Cursor |
| Source | websiteprompts.com |
Create a podcast show page for a tech-focused podcast called "Ship It" — a weekly show about building startups, shipping products, and the stories behind successful tech companies. The design should feel modern, content-rich, and audio-first.
1. HERO SECTION
- Podcast cover art (square, 400×400px placeholder) on the left
- Right side content:
- Show title: "Ship It"
- Tagline: "Stories from the builders shaping the future of tech"
- Host names: "Hosted by Maya Park & Diego Santos"
- Rating: ★★★★★ (4.9) · 12K+ ratings
- Subscribe buttons row: Apple Podcasts, Spotify, YouTube, Google Podcasts, RSS — each with platform icon and brand color
- Episode count: "187 episodes · New episodes every Tuesday"
- Background: subtle gradient from #0F172A to #1E293B
2. LATEST EPISODE (featured card, full-width)
- Large card with episode artwork on left, content on right
- Episode number + date: "EP 187 · March 4, 2026"
- Title: "How Figma Rebuilt Their Multiplayer Engine"
- Guest: "with Dylan Field, CEO of Figma"
- Description (2-3 sentences): "Dylan shares the technical decisions behind Figma's real-time collaboration system, the challenges of scaling WebSocket connections to millions of users, and why they rewrote their rendering engine in Rust."
- Duration: "58 min"
- Inline audio player: play/pause button, progress bar, current time / total time, playback speed (1x), volume
- Action buttons: "Show Notes" · "Transcript" · "Share"
- Tags: #design-tools #engineering #scaling
3. EPISODE LIST (main content area)
- Search bar: "Search 187 episodes..." with filter icon
- Filter tabs: All · Founders · Engineering · Design · Growth · AI
- Episode cards (list layout, 8-10 visible with "Load More"):
- EP 186: "Inside Linear's Product Philosophy" — with Karri Saarinen — Mar 4 — 47 min
- EP 185: "Scaling to 10M Users with a 5-Person Team" — with Sarah Chen — Feb 25 — 52 min
- EP 184: "Why We Chose Rust for Our Backend" — with James Liu — Feb 18 — 41 min
- EP 183: "The Art of Developer Marketing" — with Emily Zhang — Feb 11 — 38 min
- EP 182: "From Side Project to $50M ARR" — with Marcus Johnson — Feb 4 — 55 min
- EP 181: "Designing for AI-First Products" — with Anna Kowalski — Jan 28 — 44 min
- Each card: episode number, title, guest name, date, duration, play button, 1-line description preview
- Hover: card background shifts to #1E293B, play button highlights
4. POPULAR EPISODES SECTION (horizontal scroll on mobile)
- Headline: "Most Popular Episodes"
- 4 featured episode cards (larger format with artwork):
- "How Notion Built a $10B Company" — 2.1M plays
- "The Vercel Origin Story" — 1.8M plays
- "Stripe's API Design Principles" — 1.5M plays
- "Why Every Startup Needs a Design System" — 1.2M plays
- Play count badge on each card
5. GUEST SPOTLIGHT (3-column grid)
- Headline: "Notable Guests"
- 6 guest cards:
- Circular photo, name, title, company, episode number link
- Guest 1: Dylan Field — CEO, Figma — EP 187
- Guest 2: Guillermo Rauch — CEO, Vercel — EP 156
- Guest 3: Patrick Collison — CEO, Stripe — EP 142
- Guest 4: Emmett Shear — Co-founder, Twitch — EP 128
- Guest 5: Julie Zhuo — Author & Advisor — EP 115
- Guest 6: Sahil Lavingia — CEO, Gumroad — EP 98
- "View All Guests" link
6. ABOUT THE HOSTS (2-column layout)
- Host 1: Maya Park
- Photo (rounded square)
- Bio: "Former engineering lead at Stripe. Maya brings deep technical expertise and a passion for developer tools."
- Social links: Twitter, LinkedIn
- Host 2: Diego Santos
- Photo (rounded square)
- Bio: "Serial founder and YC alum. Diego focuses on the business and growth side of building products."
- Social links: Twitter, LinkedIn
7. NEWSLETTER SIGNUP
- Headline: "Get Show Notes in Your Inbox"
- Description: "Weekly email with episode summaries, links mentioned, and bonus content."
- Email input + "Subscribe" button
- "Join 18,000+ subscribers" social proof text
- Privacy note: "No spam. Unsubscribe anytime."
8. SPONSORS SECTION
- Headline: "Brought to You By"
- 3 sponsor cards (horizontal):
- Sponsor logos with "Learn more" links
- Example sponsors: Vercel, LinearB, Datadog
- "Interested in sponsoring? Get our media kit →" link
9. STATS & SOCIAL PROOF BAR
- 4 metrics: 2M+ Total Downloads · 187 Episodes · 120+ Guests · 18K Newsletter Subs
- Platform ratings: Apple Podcasts 4.9★ · Spotify 4.8★
10. FOOTER
- Platform links: Apple Podcasts, Spotify, YouTube, Google Podcasts, RSS Feed
- Links: About, Contact, Sponsor, Media Kit, Privacy Policy
- Social: Twitter, LinkedIn, Instagram, YouTube
- "© 2026 Ship It Podcast. All rights reserved."
Design: Dark theme optimized for readability. Background: #0F172A (slate-900), cards: #1E293B (slate-800), text: #F1F5F9 (slate-100), accent: #F59E0B (amber-500) for play buttons and highlights, secondary accent: #8B5CF6 (violet-500) for tags. Typography: Cal Sans or Space Grotesk for headings, Inter for body. Cards with 12px border-radius, 1px border #334155. Audio player with custom-styled range input.
Responsive: On mobile, hero stacks vertically with cover art centered, episode list becomes full-width cards, guest grid switches to horizontal scroll, subscribe buttons wrap to 2-column grid. Sticky mini audio player at bottom when playing an episode (shows episode title, play/pause, progress).How to use it
- Copy the full prompt with the button above.
- Paste it into your model and add your brand, copy and colours.
- Ask for one section at a time if the first pass is too broad.
Compiled and written by HowToPrompts from public sources. View original source ↗
← Back to Website Prompts