Files
hoelee-blog/scripts/banner-gen
hoelee 044ded45b3
Deploy / build (push) Successful in 19s
Add TRIM corruption sequel post + publish SATA cable post (en/zh, og+banner)
- New post: 'The Corruption Came Back on Different Drives — the Cause Was
  TRIM, Not the SSDs' — same 0x8941f998 zeros fingerprint on a second drive
  stack (IronWolf 110 SATA pair), root cause queued TRIM (FreeBSD gag 264139),
  fix diskAutotrim=off + nodiscard, scrub evidence, enterprise SATA buying
  guidance. en + zh, custom OG + banner.
- Publish formerly-draft SATA cable post (draft:false) with OG + banner.
- Correct drive identity in both: ZA960NM10001 is Seagate IronWolf 110, not
  'Samsung PM9A3' (PM9A3 is NVMe; FPDMA errors are SATA-only).
- Old RAID post (en+zh): cross-link to sequel, fix 'a Samsung' -> IronWolf 110.
2026-09-18 05:38:13 +08:00
..

banner-gen — per-post banner/hero image generator

Generates a branded 1600×900 (16:9) banner image for a blog post — shown at the top of the article, above the title. Matches the site's cobalt-blue branding and the "terminal / debugging" visual language (siblings with scripts/og-gen/, which produces the 1200×630 social-share image).

Usage

node scripts/banner-gen/generate.mjs <post-slug>

Reads the post's category from frontmatter, fills template.html, renders with headless Chrome, and writes public/banners/<slug>.png.

Then add banner: /banners/<slug>.png to the post frontmatter (en + zh) — [...slug].astro renders it above the H1 title.

Customizing content

Each post's banner content lives in BANNERS in generate.mjs, keyed by slug, with three parts:

  • titlebar — the terminal window's title-bar text
  • lines — terminal body rows: { t, text } where tcmd · dim · err (red) · ok (green) · hl (amber) · prompt ($)
  • flow — bottom pipeline steps: { n: '1', label: '...', err?: true }

No entry → a generic default banner.

Requirements

  • Google Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe (CHROME_PATH to override).
  • Node 20+.

Relationship to og-gen

  • og-gen → public/og/<slug>.png (1200×630, 2:1) for social sharing.
  • banner-gen → public/banners/<slug>.png (1600×900, 16:9) for the article hero. The banner is a "filled" visual (terminal + flow pipeline), not a poster — avoid large empty margins.