Skip to content

davidvkimball/astro-modular

Repository files navigation

Astro Modular

A flexible blog theme designed for Obsidian users.

Astro Modular with the Oxygen theme applied, homepage. Astro Modular Obsidian vault.

Badges

Netlify Status GitHub last commit GitHub commit activity Obsidian Compatible Markdown Support

Tech Stack

Astro TypeScript Tailwind CSS Node.js pnpm

Why Astro Modular?

  • Obsidian As A CMS: Works with Obsidian out of the box, write and publish instantly
  • Highly Customizable: Every feature can be enabled/disabled independently
  • Performance-Focused: Assets are highly optimized for lightning-fast loading
  • SEO-Ready: Automatic sitemap, RSS feed, and Open Graph image generation

Features

  • Custom Themes
  • Feature Toggle Control
  • Dark/Light Mode
  • Search & Command Palette
  • Wikilinks & Linked Mentions
  • Obsidian-Style Callouts
  • Folder-Based Posts
  • Multiple Content Types (Posts, Pages, Projects, Documentation)
  • Image Optimization
  • Automatic Sitemap, RSS, Open Graph, robots.txt, & llms.txt Generation
  • Table of Contents
  • Smooth Scroll & Page Transitions
  • Image Gallery & Lightbox
  • Reading Time & Word Count
  • Tagging
  • Profile Picture
  • Comments

Quick Start

Deploy to Netlify Deploy with Vercel

Prerequisites

  • Node.js 18 or higher
  • pnpm (recommended) or npm

Note

While this theme works great with any markdown editor, it's specifically optimized for Obsidian use. See the Astro Suite Vault Guide for Obsidian-specific features.

Setup

  1. Install:

    pnpm install
  2. Preview:

    pnpm dev

    Your blog will be available at http://localhost:5000

  3. Build for production:

    pnpm build
  4. Update theme (optional):

    # Safe update (recommended) - preserves your content
    pnpm run update-theme
    
    # Content update (use with caution) - may overwrite your content
    pnpm run update-theme:content

    The update command helps you keep your theme up to date with the latest features and fixes while protecting your content by default.

Configuration

Edit src/config.ts to customize your site - change the theme, enable/disable features, and configure all settings.

Deployment

Set your deployment platform once in src/config.ts under deployment.platform ("netlify", "vercel", or "github-pages"). The build process automatically generates the correct configuration files for your chosen platform - no environment variables needed!

Documentation

For detailed guides, see the included blog posts:

For AI Agents & Developers: See AGENTS.md for comprehensive technical documentation.

Contributing

This is an open-source project. Feel free to submit feature requests, report bugs, or contribute improvements.

License

MIT License