Coming SoonThe template gallery is under development. Templates will be available when the landing page builder launches.
Template Overview
Templates provide professionally designed starting points for your landing pages. Each template is:
- Optimized for its use case - Layout and sections chosen for maximum effectiveness
- Fully customizable - Change any element after selection
- Mobile responsive - Looks great on all devices
- Brand-ready - Automatically applies your organization theme
Available Templates
Product Drop
For queue-based product releases and limited edition launches.
| Section | Included |
|---|
| Hero | Bold headline, countdown, product image |
| Features | 3-column benefits grid |
| Product Details | Specs, pricing, availability |
| Experience Widget | Queue interface |
| FAQ | Common questions |
| CTA | Final call-to-action |
Best for:
- Limited edition releases
- Sneaker drops
- Product launches
- Pre-order campaigns
┌─────────────────────────────────────────────────┐
│ [Product Image] │
│ │
│ Limited Edition Release │
│ 02d 14h 32m 45s │
│ │
│ [ Join the Queue ] │
├─────────────────────────────────────────────────┤
│ ┌───────┐ ┌───────┐ ┌───────┐ │
│ │ Fast │ │ Fair │ │ Safe │ │
│ │Shipping│ │ Queue │ │Checkout│ │
│ └───────┘ └───────┘ └───────┘ │
├─────────────────────────────────────────────────┤
│ [Experience Widget] │
├─────────────────────────────────────────────────┤
│ FAQ Accordion │
├─────────────────────────────────────────────────┤
│ Don't miss out - Join Now │
│ [ Get in Queue ] │
└─────────────────────────────────────────────────┘
Raffle / Draw
For lottery-style giveaways and random selection events.
| Section | Included |
|---|
| Hero | Prize showcase, entry countdown |
| Prize Details | What’s being given away |
| How It Works | 3-step process explanation |
| Experience Widget | Draw entry interface |
| Rules | Terms and conditions |
| CTA | Enter now encouragement |
Best for:
- Giveaways
- Contest entries
- Lottery-style releases
- Promotional draws
┌─────────────────────────────────────────────────┐
│ [Prize Image] │
│ │
│ Win This [Product] │
│ Entry closes in 2 days │
│ │
│ [ Enter to Win ] │
├─────────────────────────────────────────────────┤
│ The Prize │
│ [Image] Description of what you could win │
│ Estimated value: $X,XXX │
├─────────────────────────────────────────────────┤
│ How It Works │
│ 1. Enter 2. Wait 3. Win │
├─────────────────────────────────────────────────┤
│ [Experience Widget] │
├─────────────────────────────────────────────────┤
│ Official Rules │
└─────────────────────────────────────────────────┘
Auction
For competitive bidding experiences.
| Section | Included |
|---|
| Hero | Item showcase, current bid display |
| Item Gallery | Multiple product images |
| Item Details | Description, condition, provenance |
| Experience Widget | Bidding interface |
| Bid History | Recent bids (optional) |
| Terms | Auction rules and payment terms |
Best for:
- Charity auctions
- Collectible sales
- Unique item sales
- Fundraising events
┌─────────────────────────────────────────────────┐
│ [Item Image] │
│ │
│ Rare Collectible Item │
│ Current Bid: $1,250 │
│ Ends in: 4h 32m │
│ │
│ [ Place Bid ] │
├─────────────────────────────────────────────────┤
│ [Thumb] [Thumb] [Thumb] [Thumb] │
│ Item Gallery │
├─────────────────────────────────────────────────┤
│ About This Item │
│ Detailed description... │
├─────────────────────────────────────────────────┤
│ [Experience Widget] │
├─────────────────────────────────────────────────┤
│ Auction Terms │
└─────────────────────────────────────────────────┘
Waitlist
For pre-launch signups and interest collection.
| Section | Included |
|---|
| Hero | Coming soon message, signup form |
| Value Props | Why join the waitlist |
| Social Proof | Early interest stats |
| Experience Widget | Waitlist signup |
| Referral | Share to move up (optional) |
Best for:
- Product launches
- Beta signups
- Early access programs
- Interest gauging
┌─────────────────────────────────────────────────┐
│ Something Big is Coming │
│ │
│ Be the first to know when │
│ [Product] launches │
│ │
│ [ Join Waitlist ] │
├─────────────────────────────────────────────────┤
│ Why Join Early? │
│ Early access | Exclusive pricing | First dibs │
├─────────────────────────────────────────────────┤
│ 10,432 people already waiting │
├─────────────────────────────────────────────────┤
│ [Experience Widget] │
├─────────────────────────────────────────────────┤
│ Share to move up in line │
│ [Twitter] [Facebook] [Copy Link] │
└─────────────────────────────────────────────────┘
Template Customization
After selecting a template, customize every element:
What You Can Change
| Element | Customization Options |
|---|
| Text | Headlines, body copy, button labels |
| Images | Hero images, gallery items, icons |
| Colors | Override theme colors per-section |
| Sections | Add, remove, reorder sections |
| Layout | Section variants, column arrangements |
| Widget | Styling, placement, behavior |
What Remains
| Element | Behavior |
|---|
| Responsive grid | Maintained for mobile compatibility |
| Accessibility | Semantic structure preserved |
| Performance | Optimized asset loading |
Style Directions
Templates come with style presets:
Bold
High contrast, dramatic typography:
- Large headlines
- Strong shadows
- Vibrant colors
- Maximum impact
Minimal
Clean, sophisticated, understated:
- Subtle typography
- Generous whitespace
- Muted colors
- Focus on content
Vibrant
Energetic, colorful, playful:
- Gradient backgrounds
- Colorful accents
- Dynamic layouts
- Fun personality
Premium
Luxurious, refined, exclusive:
- Elegant typography
- Dark themes
- Subtle animations
- High-end feel
Using Templates
Step 1: Choose Template
Browse the gallery and select a template that matches your experience type.
Step 2: Preview
See the template with your brand theme applied.
Step 3: Customize
Modify content, images, and styling to match your needs.
Step 4: Publish
Preview final result and publish when ready.
Industry-Specific Templates (Coming Soon)
Planned industry templates:
| Industry | Template Focus |
|---|
| Fashion | Lookbook-style, editorial |
| Tech | Clean, feature-focused |
| Food & Beverage | Appetizing imagery, urgency |
| Entertainment | Event-focused, countdown |
| Sports | Dynamic, energetic |
| Luxury | Premium, exclusive |
Template Updates
Templates are periodically updated with:
- New section types
- Design improvements
- Performance optimizations
- Accessibility enhancements
Updates don’t affect existing landing pages - only new pages using templates.
Current Workarounds
Until templates are available:
Manual Section Assembly
Use the section library to build pages manually:
- Start with Hero section
- Add Features section
- Add Experience Widget block
- Add FAQ section
- Add CTA section
Reference Designs
Use the landing page analyzer to extract styles from existing pages:
# Analyze a reference page
bun run packages/landing-page-analyzer/src/index.ts analyze https://example.com/landing-page
# Generate with that style
bun run packages/landing-page-analyzer/src/index.ts generate \
--analysis output.json \
--product your-product.json
See the Landing Page Analyzer documentation.
SDK Implementation
Build a custom landing page with the SDK:
import { FanfareProvider, ExperienceWidget } from "@waitify-io/fanfare-sdk-react";
export function ProductDropPage() {
return (
<FanfareProvider config={{ organizationId: "...", publishableKey: "..." }}>
{/* Hero */}
<section className="hero">
<h1>Limited Edition Release</h1>
<Countdown targetDate="2024-03-15T10:00:00Z" />
</section>
{/* Features */}
<section className="features">{/* Feature cards */}</section>
{/* Widget */}
<section className="widget">
<ExperienceWidget experienceId="exp_..." />
</section>
{/* FAQ */}
<section className="faq">{/* FAQ accordion */}</section>
</FanfareProvider>
);
}
Next Steps