Setup and Customize This Theme

This guide walks you through setting up and customizing this Astro theme for your own use.

Prerequisites

• Bun (recommended) or Node.js ≥ 22

Installation

git clone https://github.com/vanam-san/vanam-erudite.git
cd vanam-erudite
bun install

Start the dev server:

bun run dev

Visit http://localhost:4321. Press ⌘K (or /) any time to try the command palette — in dev it searches titles; production builds get full-text search via a Pagefind index generated at build time.

Configuration

Edit src/consts.ts to personalize your site:

1
export const SITE = {
2
  title: "Your Site",
3
  description: "Your description.",
4
  locale: "en-US",
5
  dir: "ltr",
6
  defaultPageImage: "/static/opengraph-image.png",
7
  defaultPostImage: "/static/1200x630.png",
8
}
9

10
export const HERO = {
11
  name: "Your Name",
12
  title: "Your Title",
13
  bio: "Short bio about yourself.",
14
}
15

16
export const NAVIGATION = [
17
  { href: "/about", label: "About" },
18
  { href: "/blog", label: "Blog" },
19
  { href: "/gallery", label: "Gallery" },
20
  { href: "/projects", label: "Projects" },
21
]
22

23
export const SOCIALS = [
24
  { href: "https://github.com/yourusername", label: "GitHub", icon: GitHub },
25
  { href: "https://twitter.com/yourusername", label: "Twitter", icon: Twitter },
26
  { href: "mailto:your@email.com", label: "Email", icon: Email },
27
  { href: "/rss.xml", label: "RSS", icon: RSS },
28
]

HERO drives the homepage who/intro tiles. NAVIGATION renders the sidebar (Home is added automatically). Also set site: in astro.config.ts to your production domain — canonical URLs, sitemap, and RSS depend on it.

Images

Replace the placeholders in public/static/:

• avatar.svg — homepage avatar placeholder (replace with your square photo, ~500px)
• opengraph-image.png, 1200x630.png, twitter-card.png — social cards
• logo.png / logo.svg — sidebar brand mark (or edit src/assets/logo.svg)

Adding Content

Blog Posts

Create a folder in src/content/blog/ with an index.md:

1
---
2
title: 'My Post'
3
description: 'Post description'
4
date: 2026-01-01
5
authors: ['your-author-id']
6
tags: ['tag1', 'tag2']
7
draft: false
8
---
9

10
Your content here.

Projects

Create markdown files in src/content/projects/:

1
---
2
name: 'Project Name'
3
description: 'Description'
4
link: 'https://github.com/you/project'
5
tags: ['TypeScript', 'React']
6
startDate: 2024-01-01
7
endDate: 2024-06-01
8
draft: false
9
---

Galleries

Create a folder in src/content/gallery/ with images and an index.md:

1
---
2
title: 'Gallery Title'
3
description: 'Description'
4
date: 2026-01-01
5
cover: './cover.jpg'
6
photos:
7
  - './photo1.jpg'
8
  - './photo2.jpg'
9
draft: false
10
---

Authors

Create files in src/content/authors/:

1
---
2
name: 'Your Name'
3
avatar: 'https://avatars.githubusercontent.com/u/...'
4
bio: 'Your bio'
5
socials:
6
  github: 'https://github.com/you'
7
---

avatar accepts a full URL or a /static/... path. pronouns, mail, and bio are optional.

Environment Variables

Copy .env.example to .env and fill in (all optional — the site works without them):

• UMAMI_WEBSITE_ID (+ UMAMI_HOST, defaults to cloud.umami.is) — Umami analytics
• GISCUS_REPO, GISCUS_REPO_ID, GISCUS_CATEGORY, GISCUS_CATEGORY_ID — Giscus comments (values from giscus.app)

Deployment

Build and deploy to your preferred platform:

bun run build

The output is in dist/. Deploy to Vercel, Netlify, Cloudflare Pages, or any static host — the Pagefind search bundle is generated into dist/pagefind/, nothing extra to configure. Set site: in astro.config.ts to your production domain first.