Compose publication blocks

From the theme directory, add the blocks you want:

npx ghostcn@1.4.0 add card button post-grid author-list tag-grid archive-header --skip-existing

Ghostcn installs missing dependencies first and preserves existing dependency files, including when you explicitly overwrite the requested block. To replace a dependency, add it explicitly after reviewing its diff. Nested partial references follow your configured alias.

Nest a partial in a cardCopy Anchor Link

{{#> "components/card" heading="A home for your readers" class="mx-auto max-w-md p-8"}}
    <p>Your own trusted template content.</p>
    {{> "components/button" text="Explore" href="/about/" class="rounded-xl" variant="default"}}
{{/components/card}}

A card accepts escaped text via body or trusted template content through a Handlebars partial block. Nested partials inherit the current context; explicitly set or reset values such as class="" and variant="default" when necessary. Use trusted URLs for links. HTML escaping alone does not sanitize a URL.

Compose with Ghost contentCopy Anchor Link

{{> "components/post-grid" posts=posts heading="Latest stories" cardClass="rounded-xl"}}
{{> "components/author-list" heading="Our authors"}}
{{> "components/tag-grid" heading="Topics" cardVariant="outline"}}

{{#tag}}
    {{> "components/archive-header" eyebrow="Topic" archiveImage=feature_image}}
{{/tag}}

Post grids use the current collection; author and tag blocks use Ghost queries capped at 100 records. Use custom paginated queries for larger directories. Blocks that support emptyText can display that message instead of rendering nothing when their query returns no results.

Use native statesCopy Anchor Link

• Buttons default to type="button". Disabled links have no navigation or Portal action.
• Inputs have a wrapping label and optional native validation. Use a unique hintId for each input with help text.
• Alerts default to a status region. Use urgent=true only for urgent dynamic announcements.
• Primitives do not implement membership flows. Use the Newsletter Form or native Portal actions where appropriate.

Try the full showcaseCopy Anchor Link

The sample index template demonstrates all 23 components. Try it in a disposable Tailwind starter, not over an existing homepage. Install the components it references and use real sample posts, authors, public tags, and membership tiers to reveal conditional sections. Its membership actions are real when rendered by Ghost.