コンテンツにスキップ
まだあたたかい

Welcome to Chirping Astro

Start here. A guided tour of every feature this Astro v6 + Tailwind v4 + daisyUI theme ships with  Eand a map of the dedicated demo posts that show each one in detail.

Announcements 3 分で読めます
Responsive rendering of Chirping Astro theme on multiple devices.
Responsive rendering of Chirping Astro theme on multiple devices.

Hello, and welcome. Chirping Astro is a single-template, multilingual Astro v6 theme inspired by Chirpy and rebuilt from scratch with a strict TypeScript codebase, Tailwind v4, daisyUI v5, MDX, Pagefind and Giscus.

This post is the front door. Every other post on this site is a focused, feature-specific tutorial  Estart with whichever one matches what you want to learn first.

  • Chirpy-style three-column layout  Esidebar with avatar and nav, a reading column, and a right-hand panel with the table of contents on posts and “Recently updated / Trending tags” on listings.
  • First-class i18n  EEnglish at the URL root, French under /fr, with a smart language switcher that lands on the equivalent translated article when one exists.
  • Markdown + MDX with Expressive Code for syntax highlighting, copy buttons, frame titles, line markers, diffs and collapsible sections.
  • LaTeX math via KaTeX, pre-rendered at build time with zero client JavaScript  Eand the stylesheet only loads on pages that opt in.
  • Pagefind search  Ea header modal with / and Cmd/Ctrl+K shortcuts, plus a dedicated /search/ page.
  • Giscus comments wired to GitHub Discussions, theme- and locale-synced, with a per-post override.
  • Two daisyUI themes (chirpy-light / chirpy-dark) with an animated toggle that uses the View Transitions API where supported.
  • Privacy Policy  Ebilingual customizable templates with a toggleable footer link (set showPrivacyPolicy: true/false in src/config.ts).
  • Reading time, sticky TOC with scroll-spy, RSS per locale, hreflang sitemap, accessible focus management  Ethe boring details done right.

Each of the posts below is dedicated to a single feature. They double as demos: where a post talks about math, the post itself sets math: true; where a post talks about featured images, the post itself sports a hero image; and so on.

FeatureRead this post
Frontmatter & schemaFrontmatter reference
Typography & MarkdownTypography & Markdown
Code blocksCode blocks & syntax highlighting
Alert code blocksAlert plugin: all variants
LaTeX mathLaTeX math with KaTeX
MDX componentsMDX components & callouts
i18nBilingual content & i18n
SearchSearch with Pagefind
CommentsComments with Giscus
ThemingTheming & dark mode
Featured imagesFeatured images & media

This post is pinned  Ethat’s the pinned: true flag in its frontmatter working. Pinned posts always sort to the top of listings and the home page, even if newer posts exist.

Everything in this codebase is meant to read like a normal Astro project, not a configuration soup. If you want to extend it:

Setting up the theme from a fresh clone is documented in detail in the project README.md at the root of the repository  Eopen it in your editor, or click the Chirping Astro link in the site footer to jump to the upstream theme repo. You can customize that link in SITE.footer.themeUrl inside src/config.ts.

Want to skip the demo content and start fresh? Use the Chirping Astro Starter  Ea minimal, ready-to-deploy version that’s automatically kept in sync with this theme:

Terminal window
bunx create-astro@latest --template kannansuresh/chirping-astro-starter

Enable GitHub Pages, push, and you’re live.

Happy chirping. ✨