Skip to content
BaseLayer Themes

Blog 01

Recent posts from the blog collection

File: src/blocks/blog/Blog01.astro

Blog listing grid. Pass posts from the page (content collection). Config supplies heading, limit, and CTA defaults.

Config (blocks.tsblog)

blog: {
    width: "standard",
    heading: "Latest writing",
    subheading: "Notes on web development, performance, and shipping great sites.",
    ctaLabel: "View all posts",
    ctaUrl: "/blog/",
  },

Add to a page

---
import Blog01 from "@/blocks/blog/Blog01.astro";
---

<Blog01 />

Props override matching keys from config:

<Blog01
  heading="Custom headline"
/>

Props

Prop Config key Type / values Default / notes
sectionId string Default "blog"; DOM id for the section; not in config
heading blog.heading string
subheading blog.subheading string
posts — (page prop) CollectionEntry<"blog">[] Usually passed from the page (content collection)
limit blog.limit number Max items to show from the collection/array
showCta blog.showCta boolean Show the “view all” CTA
ctaLabel blog.ctaLabel string
ctaUrl blog.ctaUrl string

← Blog versions · Blocks overview