ComponentsPublishing
Related Posts
Related reading from the same primary tag, excluding the current post; recent posts when untagged.
Install
npx ghostcn@1.4.0 add related-posts --skip-existingUsage
Use inside {{#post}}. Results share the primary tag; untagged posts fall back to recent posts. The current post is excluded, and the section is hidden when there are no results. Set heading="More stories" to change the title.
{{#post}}
{{> "components/related-posts"}}
{{/post}}Customize this instance
{{#post}}
{{> "components/related-posts" class="my-6" titleClass="text-purple-700 dark:text-purple-300"}}
{{/post}}Styling parameters
| Parameter | Target |
|---|---|
class | Component root — .ghcn-related |
titleClass | .ghcn-related__title |
gridClass | .ghcn-related__grid |
cardClass | .ghcn-related__card |
cardTitleClass | .ghcn-related__card-title |
imageClass | .ghcn-related__image |
contentClass | .ghcn-related__content |
descriptionClass | .ghcn-related__description |
Styling parameters affect only elements that render. See Style component instances for specificity, dark mode, and preserving customizations.
Installed files
partials/components/related-posts.hbsassets/css/components/related-posts.css
Was this helpful?