Lesson 1
Video: YouTube embed.
This lesson demonstrates a YouTube video embed. Replace the video ID with your unlisted YouTube video. See guides/47b-video-hosting.md for pros/cons of YouTube vs self-hosted vs Vimeo vs Loom.
For self-hosted MP4, Vimeo, or Loom snippets, see /_shared/lesson-elements.html sections 1 to 4.
Lesson 2
Audio: self-hosted MP3.
Pill-shaped audio player. Drop your .mp3 or .m4a file into body/website/videos/ and reference it here. Good for meditations, podcast clips, voice notes.
Tip: include a transcript below the player so the content is searchable and accessible.
Lesson 3
Callouts and code blocks.
Use callouts to flag something easy to miss. Use code blocks for commands, configs, or anything members will copy-paste.
Replace YOUR_PROJECT_ID with the value from your Supabase dashboard before running the command below.
The command
supabase functions deploy stripe-course-webhook supabase secrets set STRIPE_WEBHOOK_SECRET=whsec_xxx
Verify with supabase functions logs stripe-course-webhook.
Lesson 4
Images and embeds.
Two things in this lesson. An image with a caption underneath. And an embed: a way to drop in something from another tool (a Tally form, a Cal.com booking widget, a Notion page, a Figma design) and have it show up live, inside your lesson.
Image with caption
The caption sits underneath the image in muted italic text. Use it when the image needs explaining, or to credit the source.
Embed something from another tool
Most modern tools (Tally, Cal.com, Notion, Figma, YouTube, Vimeo) give you an "embed" link or code. Paste that into your lesson and members can use it without leaving the page.
Below is what a Tally booking form looks like when embedded. The YOUR_FORM_ID placeholder is what you replace with your actual form. Get the ID from the share/embed menu of whatever tool you are using.
For the exact code, see /_shared/lesson-elements.html.
Lesson 5
Resources and downloads.
Resource cards link out (docs, GitHub, tools). Downloads attach worksheets, PDFs, or starter files directly to the lesson.
Linked resource
Stripe Checkout docs
Reference for the payment flow used in this lesson.
Downloadable PDF
Use the download attribute so the browser saves instead of opening in-tab.