An online course landing pageyou don't have to design.

This is the long-form template — the one for a self-paced course between $99 and $999, where the page has to do all of the selling because there is no call and no salesperson. It runs about eleven sections, in the order that answers objections as they arrive rather than in the order that flatters the product.

Next.js 16 · Tailwind 4 · static export · 14-day refund

6
Full page demos
32
Components
0
Runtime dependencies
1 day
To live, realistically

Why this one

What the page has to do

Everything on it is real and editable: the curriculum accordion opens on the first module to show depth, the deadline countdown reads a single ISO date, the sticky bar appears after the hero and carries the price, and the FAQ emits FAQPage structured data so Google can expand your questions in search results.

You change one typed content file — course name, price, modules, testimonials, FAQ — and deploy. Nothing about the layout needs touching for the page to look like someone designed it, because someone did.

In the box

Every section, already built

In the order they appear on the demo. Delete any of them and the page still holds together — they are separate components, not a theme.

  1. 01

    Hero with a video frame

    Masked headline lines that wipe up on load, one accent word in serif italic, a price reassurance line and a star rating. The video frame links to a trailer, or you swap in a dates card, a form or a book mock.

  2. 02

    Curriculum accordion

    Modules and lessons with runtimes, built on native <details>. Zero JavaScript, keyboard accessible for free, first module open so the depth is visible without a click.

  3. 03

    Bonus stack with stated values

    The block that makes $349 feel like a discount. Each bonus carries a value and the total sits under it, which is the entire mechanism.

  4. 04

    Two-tier pricing and a guarantee

    A featured dark tier, a payment plan line, and the refund promise directly underneath — the objection answered at the exact moment it appears.

  5. 05

    Deadline countdown and sticky bar

    A live countdown to one ISO date, and a sticky enrol bar that carries the price down the page. The only two client components in the kit, because time and scroll position genuinely need them.

  6. 06

    Proof, instructor and FAQ

    A testimonial wall with one featured quote, an instructor block written for authority rather than biography, and an FAQ that ships FAQPage JSON-LD.

Fit

Use this one if

  • You sell a self-paced course and the page has to close the sale alone.
  • Your price is high enough that people read before buying — roughly $99 up.
  • You have a curriculum, a few testimonials and a refund policy.
  • You would rather spend the weekend recording than choosing a typeface.

Three steps

From clone to live, this afternoon

  1. 1Clone and run itnpm install, npm run dev. All six demos are on your machine in about a minute.
  2. 2Edit one data fileOpen the content file for this page and replace the copy, the price and the proof. TypeScript flags anything you miss.
  3. 3DeployPush to GitHub, connect Vercel. It is a static site, so the free tier is genuinely enough.
Start with the free version

Questions

About the online course landing page template

Will this work for a free or very cheap course?+

It will, but it is longer than a $19 course needs. Use the webinar template for anything free — matching the page length to the size of the ask is most of what makes a page feel professional.

Can I connect it to Teachable, Kajabi or Podia?+

Yes. The page is your sales page and the checkout stays wherever it already is: set checkoutUrl to your Gumroad, Stripe, Teachable or Podia link and every enrol button follows it.

How long does it take to make it mine?+

An afternoon for content, and the design needs nothing. Replace one data file, drop in your fonts and colours if you have them, deploy to Vercel.

Also in the kit

Five other page types come with it

One purchase covers all six. Different offers want different pages, and most people end up using two.

See all six examples — or browse the other template pages: course website, cohort course, webinar landing page, coaching website, newsletter landing page, ebook landing page.

Six templates,one afternoon.

$39 today, $59 once the launch window closes. Lifetime updates, 14-day refund, and the free version is a real page rather than a teaser.