c888f3f5e6
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>
151 lines
3.5 KiB
Markdown
151 lines
3.5 KiB
Markdown
# 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):
|
|
|
|
```bash
|
|
# 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:
|
|
|
|
```javascript
|
|
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
|
|
|
|
- **11ty Docs:** https://www.11ty.dev/docs/
|
|
- **Cloudflare Pages:** https://pages.cloudflare.com/
|
|
- **Formspree:** https://formspree.io/
|
|
- **Gemini Consultation:** docs/planning/gemini-consultations/ghost-vs-static-website-2026-04-02.md
|
|
|
|
---
|
|
|
|
**Fire + Frost + Foundation = Where Love Builds Legacy** 🔥❄️⚡
|