Coffee advertorial example: why does coffee at home taste bitter?
An article-style pre-sell page for Kettleby, a fictional coffee roaster. Five causes of bitter coffee come first, each with a fix that works with any equipment; the subscription appears only after a band that says who paid for the page.
Part 2 of 3One brand, three pages- Page type
- Advertorial
- Canvas
- Desktop · 1280 px
- Sections
- 8
- Brand
- Kettleby (demo brand)
Download and usage details
- Files
- HTML + CSS · images included
- Usage
- Free to edit and use in personal and commercial projects. Attribution is optional. Do not resell or redistribute the templates themselves as templates.
- Forms, if included
- They look complete but do not send anything. Point the form at your own form service or email tool before you publish.
- Fonts
- Fonts load from Google Fonts
- Demo content
- Every brand is a fictional demo brand, and the copy was written for that demo. Replace product facts, offers and any testimonials with your own, and check every claim before you publish.
What we typed
An advertorial: an article-style pre-sell page built around one reader question, why does my coffee at home taste bitter? Near the top, label it clearly as sponsored content from Kettleby. The first half explains five common causes with a fix for each that anyone can use with their own equipment: stale beans, a grind that is too fine, water that is too hot, brewing for too long, and a brewer that needs cleaning. Only in the second half, introduce the Kettleby subscription as one way to fix the stale-bean cause: whole beans roasted within 3 days of shipping, with the first bag at 30% off. No health claims, and no invented studies, statistics, reviews, quotes or expert names. Main action: Try your first bag. In the footer, add one line: Kettleby is a demo brand created to show what Octet Prow can build. It is not a real company and nothing here is for sale.
Kettleby — Roastery Ledger
- primary · #4A2C1B
- secondary · #C2761F
- tertiary · #5E7355
- surface · #FBF6EE
- outline · #C9BBA8
- inverse · #241A13
- Serif · Fraunces
- Sans · Inter
- Mono · IBM Plex Mono
Generated once for the project from its brief. Every page in the project follows it.
How the page is put together
- OpeningWhy does my coffee at home taste bitter?The sponsored label, the reader’s question and a one-paragraph answer. No product yet.
- 01Your beans are staleCause one: stale beans, with a fix for any beans.
- 02Your grind is too fineCause two: grind size, with a starting point for each brewer.
- 03Your water is too hotCause three: water temperature, without needing a thermometer.
- 04Your brew runs too longCause four: brew time, with target times for pour-over and AeroPress.
- 05Your brewer needs cleaningCause five: a brewer that needs washing.
- 06Five things to change tonightThe five fixes as one checklist.
- 07So here is the honest part: this page is paid for by the people who sell the beans.Who paid for the page, then the subscription as one fix for stale beans, with 30% off the first bag.
What we checked and changed
The subscription card said every 2 weeks or every month and offered light, medium and dark roasts; the product page says every 2 or 4 weeks and has no roast choice. We asked the editor to match the product page, and the first step now asks how often you want a bag. Both “Try your first bag” buttons had no link, so we pointed them at the product page. The page has two dark bands, one mid-article and the footer, where the design system allows one; we left it as generated. The image was generated in the editor before publishing.