0
Documentation / Content Stacks

Content Stacks

Reusable content blocks you build once and embed across multiple pages via a single shortcode.

What It Does

A Content Stack is a JSON-backed block of content (HTML, markdown, images, videos, YouTube/Facebook/X embeds) that you drop into any page with . Edit it once, it updates everywhere it’s embedded. Stacks support 1–3 column layouts, drag-and-drop reordering, media drops from the browser, and style presets for HTML blocks.

Getting Started

  1. Open Content Stacks from the admin menu.
  2. Click + New Stack in the top action bar, name it, and open the editor.
  3. Add blocks: HTML, markdown, YouTube, image, video, or drag media in from the Media Browser iframe.
  4. Reorder blocks by dragging. Pick a layout (1, 2, or 3 columns).
  5. Save. Embed on any page with .

Masonry Card Grid

The stack browser is a masonry card grid with variable-height cards, so longer previews don’t get clipped. Each card has a trash icon on hover for quick delete. The “+ New Stack” button lives in the top action bar, and Save/Delete actions produce a toast at top-right so you always know a save landed.

HTML Block Style Presets

HTML blocks ship with one-click style presets:

  • Glass — frosted translucent card
  • Card — standard opaque card
  • Callout — accent-bordered highlight block
  • Pad — padded container, no visible box
  • Unwrap — raw HTML, no container styling

Pick one per HTML block to match the page’s vibe without writing CSS.

Shortcode Picker & Media Drops

The shortcode picker’s sections are now collapsible and drag-reorderable — arrange the sections you use most at the top. Your order persists via localStorage. To add media, open the Media Browser iframe and drag a thumbnail directly into the stack’s playlist — the drop lands at the Y position you release, inserting an image or video block exactly where you want it.

Embedding Stacks

Primary form: . The slug is the human-readable name you gave the stack. Legacy form: — still works, resolves through a slug-first fallback so old pages don’t break. New embeds should always use .

Gotchas / Tips

  • Renaming a stack copies the data to the new slug filename; the old file hangs around as a 7-day alias.
  • If an embed goes blank, confirm the slug in the registry (admin/data/content-stacks-registry.json) matches what’s in the shortcode.
  • Markdown blocks render via Parsedown — the pre-rendered html field is preferred if present.
  • Drag-to-insert uses drop Y position. Aim carefully on long playlists.
  • HTML block style presets are non-destructive — switching preset doesn’t alter your content.
  • Don’t hand-edit content-stack-{N}.json when a content-stack-{slug}.json exists — the slug version wins.
Page Manager Shortcodes All Documentation