Skip to content
← Back to Blog
· My Site

Getting Started with This Template

guide astro

This is an example blog post demonstrating the MDX blog setup. You can write regular Markdown and also import Astro components.

Customizing the template

Start by editing src/data/site.ts with your brand name, description, and navigation links. Then update the color tokens in src/styles/global.css.

This is a callout component imported into MDX. You can create reusable components and use them directly in your blog posts.

Adding new posts

Create .md or .mdx files in src/content/blog/. Each post needs frontmatter:

---
title: "Your Post Title"
description: "A short description for SEO and previews."
pubDate: 2025-01-15
author: "Author Name"
tags: ["tag1", "tag2"]
draft: false
---

Set draft: true to hide a post from the blog index and generated routes.

Using components in MDX

MDX files (.mdx) support importing and using Astro components directly in your content. Regular Markdown files (.md) render as plain content without component support.

What’s included

  • Content collections with Zod schema validation
  • Dynamic routing via [...slug].astro
  • Draft support — draft posts are excluded from builds
  • Tags — displayed on the index and post pages
  • Typography plugin — prose styling for long-form content
  • Scroll animations — blog posts animate in via GSAP
Share: