Files
firefrost-operations-manual/website-11ty-test/README.md
Chronicler #55 c888f3f5e6 feat: Add complete 11ty test project for Ghost migration
WHAT:
- Complete 11ty static site generator project structure
- Homepage with hero and Fire/Frost path sections
- Master layout system (base + head + footer partials)
- Fire/Frost/Arcane branding CSS
- Critical .eleventy.js config from Gemini
- Ready-to-build test for Ghost CMS migration

STRUCTURE:
- _includes/layouts/base.njk (master template)
- _includes/head.njk (Fire/Frost branding, meta tags)
- _includes/footer.njk (complete footer from Ghost)
- src/css/firefrost.css (minimal responsive styles)
- index.njk (homepage with hero + path cards)
- .eleventy.js (passthrough config for CSS/images)
- package.json (11ty v3.0.0)
- README.md (complete test instructions)

GEMINI'S CRITICAL CONFIG:
eleventyConfig.addPassthroughCopy('src/css');
eleventyConfig.addPassthroughCopy('assets');
This prevents CSS/images from being ignored in build.

BUILD COMMANDS:
npm install
npx @11ty/eleventy
npx @11ty/eleventy --serve (local test at :8080)

DEPLOY TARGET:
Cloudflare Pages with:
- Build command: npx @11ty/eleventy
- Output directory: _site
- NODE_VERSION=20

ABORT CRITERIA:
- 15+ min on build errors
- CSS rewrite needed
- Mobile nav breaks

STATUS: Ready for 2-hour test on Ghost VPS

Signed-off-by: Chronicler #55 <claude@firefrostgaming.com>
2026-04-02 23:29:57 +00:00

3.5 KiB

Firefrost Gaming 11ty Website - Test Migration

Created: April 2, 2026
Purpose: 2-hour test of Ghost CMS → 11ty static site migration
Status: Ready to build and test


🚀 Quick Start

On Ghost VPS (as architect):

# Navigate to the test directory
cd /path/to/firefrost-operations-manual/website-11ty-test

# Install dependencies
npm install

# Build the site
npx @11ty/eleventy

# Serve locally for testing
npx @11ty/eleventy --serve

The site will be available at http://localhost:8080


📁 Project Structure

website-11ty-test/
├── _includes/
│   ├── layouts/
│   │   └── base.njk          # Master layout
│   ├── head.njk               # <head> partial with Fire/Frost branding
│   └── footer.njk             # Footer with all links
├── src/
│   └── css/
│       └── firefrost.css      # Minimal Fire/Frost/Arcane styles
├── assets/
│   └── images/                # (empty for now - add images here)
├── _site/                     # Build output (created after npm run build)
├── .eleventy.js               # 11ty config (CRITICAL for CSS/images)
├── package.json               # Dependencies
├── index.njk                  # Homepage
└── README.md                  # This file

🔧 Configuration

Critical .eleventy.js Config

The .eleventy.js file contains critical passthrough copy settings from Gemini:

eleventyConfig.addPassthroughCopy("src/css");
eleventyConfig.addPassthroughCopy("assets");

Without this, CSS and images won't copy to the build!


What's Included

  • Complete layout system (master + head + footer)
  • Homepage with hero and path sections
  • Fire/Frost/Arcane branding colors
  • Responsive footer grid
  • All social links from Ghost
  • Clean URLs (no .html extensions)

🎯 Test Checklist

Phase 1: Build (10 min)

  • npm install runs successfully
  • npx @11ty/eleventy builds without errors
  • _site directory created with files

Phase 2: Local Test (10 min)

  • Site loads at localhost:8080
  • Fire/Frost branding visible
  • Footer displays correctly
  • All links work
  • Mobile responsive (test with browser dev tools)

Phase 3: Deploy Test (20 min)

  • Push to Git repo
  • Connect Cloudflare Pages
  • Set build command: npx @11ty/eleventy
  • Set output directory: _site
  • Set NODE_VERSION environment variable: 20
  • Deploy to test.firefrostgaming.com

Phase 4: Evaluate (20 min)

  • Compare to Ghost site visually
  • Test all CTAs and links
  • Check mobile responsive
  • Verify Fire/Frost branding intact

🛑 Abort Criteria (From Gemini)

Pull the plug if:

  • 15+ minutes fighting build errors
  • Need to rewrite CSS to match Ghost
  • Mobile navigation breaks and can't fix in 10 minutes

📋 Next Steps (If Test Succeeds)

  1. Port remaining 6 pages:

    • About
    • Servers
    • Subscribe
    • Contact
    • Terms
    • Privacy
  2. Download images from Ghost to /assets/images/

  3. Set up Formspree for contact form

  4. Add basic SEO meta tags

  5. Deploy to production

  6. Spin down Ghost


🔗 Resources


Fire + Frost + Foundation = Where Love Builds Legacy 🔥❄️