Welcome to Astro Theme Shyne

Welcome to Astro Theme Shyne! This guide will help you understand the key features and how to customize this theme for your personal blog or portfolio.

Why Astro Theme Shyne?

Astro Theme Shyne is built with modern technologies to provide:

• Blazing fast performance with static site generation
• Beautiful Polaroid-style photo gallery
• Full TypeScript support
• SEO optimization out of the box

Getting Started

Installation

Clone the repository and install dependencies:

git clone https://github.com/FuTseYi/Astro-Theme-Shyne.git
cd Astro-Theme-Shyne
pnpm install
pnpm dev

Configuration

Edit src/config.ts to customize your site:

1
export const SITE: Site = {
2
  title: 'Your Site Name',
3
  description: 'Your site description',
4
  href: 'https://your-domain.com',
5
  author: 'Your Name',
6
}

Key Features

Polaroid Photo Gallery

One of the unique features is the Polaroid-style photo timeline. Here’s how to use it:

1. Create a new folder in src/content/photos/
2. Add your photos to an assets subfolder
3. Create an index.md file with frontmatter

1
---
2
title: My Trip
3
description: An amazing journey
4
startDate: 2026-01-01
5
favicon: ✈️
6
location: Japan
7
---
8

9
![](./assets/photo1.jpg)
10
![](./assets/photo2.jpg)

Blog Posts

Create blog posts in src/content/blog/:

1
---
2
title: My First Post
3
date: 2026-01-01
4
tags:
5
  - tech
6
---
7

8
Your content here...

Projects

Add projects in src/content/projects/:

1
---
2
name: My Project
3
description: A cool project
4
startDate: 2026-01-01
5
tags:
6
  - react
7
featured: true
8
---

Advanced Features

Subposts

For long-form content, you can organize posts into subposts:

1
src/content/blog/my-topic/
2
  index.md      (parent post)
3
  part-1/
4
    index.md    (subpost 1)
5
  part-2/
6
    index.md    (subpost 2)

Custom Components

The theme includes React components in src/components/ui/ following shadcn/ui patterns.

Deployment

Deploy to Vercel, Netlify, or any static hosting:

pnpm build

The output will be in the dist folder.

Contributing

Contributions are welcome! Please see CONTRIBUTING.md.

License

MIT License - feel free to use this theme for your own projects!

Happy blogging!