README.md

Astro Charm

A astro theme use Astro Theme Provider

WIP

Live Demo | PageSpeed

Install

1. Create an empty Astro project(if has, skip):

pnpm create astro@latest my-website --template minimal -y

2. Add the theme to your project:

pnpm add astro-charm

3. Config in your astro.config.ts:

import { defineConfig } from "astro/config";
import astroCharm from "astro-charm";

export default defineConfig({
  integrations: [
    astroCharm({
      config: {
        title: "Your Blog",
        description: "Your blog description",
        side: {
          title: "Title",
          sub: "Sub Title",
          bio: "Bio",
        },
        // for more config, see `https://github.com/Yuhanawa/astro-charm/blob/main/package/index.ts#L55-L117`
      },
    }),
  ],
});

Other way(WIP, not recommend)

edit your astro.config.ts

import { defineConfig } from "astro/config";
import astroCharm from "astro-charm";

export default defineConfig({
  integrations: [astroCharm()],
});

and run

pnpm create astro-theme@latest init astro-charm

4. Enjoy it!

TODO

• upgrade to Astro v5
• guide docs
• code copy button
• better code block
• youtube and bilibili video component
• search
• category and tag page
• init command
• live demo
• customize side
• dark mode
• comments
• sitemap
• analytics
  • now can use custom script instead temporary
• support mobile

very thankful

The source of inspiration is chanshiyu's blog.

When creating this theme, many other excellent projects were referenced.