Firefly 主题在导航栏添加新菜单和页面的完整流程

1
项目根目录/
2
├── src/
3
│   ├── config/
4
│   │   ├── navBarConfig.ts          # 1️⃣ 导航栏配置
5
│   │   └── LinkPresets.ts           # 2️⃣ 链接预设（可选）
6
│   ├── content/
7
│   │   ├── config.ts                # 3️⃣ 内容集合配置
8
│   │   └── welfare/                 # 4️⃣ 内容文件夹
9
│   │       ├── rural-education.md
10
│   │       ├── environment.md
11
│   │       └── animal-rescue.md
12
│   └── pages/
13
│       └── welfare/                 # 5️⃣ 页面路由文件夹
14
│           ├── rural-education.astro
15
│           ├── environment.astro
16
│           └── animal-rescue.astro

1
// 添加公益项目菜单
2
links.push({
3
    name: "公益项目",
4
    icon: "material-symbols:favorite",
5
    children: [
6
        {
7
            name: "乡村教育支持",
8
            url: "/rural-education/",
9
            icon: "material-symbols:school",
10
        },
11
        {
12
            name: "环境保护计划",
13
            url: "/environment/",
14
            icon: "material-symbols:forest",
15
        },
16
        {
17
            name: "动物救助行动",
18
            url: "/animal-rescue/",
19
            icon: "material-symbols:pets",
20
        },
21
        {
22
            name: "捐赠渠道",
23
            url: "https://hangdn.com",
24
            external: true,
25
            icon: "material-symbols:volunteer-activism",
26
        },
27
    ],
28
});

1
import I18nKey from "@i18n/i18nKey";
2
import { i18n } from "@i18n/translation";
3
import { LinkPreset, type NavBarLink } from "@/types/config";
4

5
export const LinkPresets: { [key in LinkPreset]: NavBarLink } = {
6
  [LinkPreset.Home]: {
7
    name: i18n(I18nKey.home),
8
    url: "/",
9
    icon: "material-symbols:home",
10
  },
11
  [LinkPreset.About]: {
12
    name: i18n(I18nKey.about),
13
    url: "/about/",
14
    icon: "material-symbols:person",
15
  },
16
  [LinkPreset.Archive]: {
17
    name: i18n(I18nKey.archive),
18
    url: "/archive/",
19
    icon: "material-symbols:archive",
20
  },
21
  [LinkPreset.Friends]: {
22
    name: i18n(I18nKey.friends),
23
    url: "/friends/",
24
    icon: "material-symbols:group",
25
  },
26
  [LinkPreset.Sponsor]: {
27
    name: i18n(I18nKey.sponsor),
28
    url: "/sponsor/",
29
    icon: "material-symbols:favorite",
30
  },
31
  [LinkPreset.Guestbook]: {
32
    name: i18n(I18nKey.guestbook),
33
    url: "/guestbook/",
34
    icon: "material-symbols:chat",
35
  },
36
  [LinkPreset.Bangumi]: {
37
    name: i18n(I18nKey.bangumi),
38
    url: "/bangumi/",
39
    icon: "material-symbols:movie",
40
  },
41
  [LinkPreset.Gallery]: {
42
    name: i18n(I18nKey.gallery),
43
    url: "/gallery/",
44
    icon: "material-symbols:photo-library",
45
  },
46
  // ✅ 添加 Welfare 映射
47
  [LinkPreset.Welfare]: {
48
    name: "公益项目",  // 或者使用 i18n: i18n(I18nKey.welfare)
49
    url: "/welfare/",
50
    icon: "material-symbols:favorite",
51
  },
52
};

1
// 添加 welfare 集合
2
const welfareCollection = defineCollection({
3
    loader: glob({ pattern: "**/*.{md,mdx}", base: "./src/content/welfare" }),
4
    schema: z.object({
5
        title: z.string(),
6
        description: z.string().optional(),
7
        published: z.date().optional(),
8
        tags: z.array(z.string()).optional(),
9
    }),
10
});
11

12
export const collections = {
13
    posts: postsCollection,
14
    spec: specCollection,
15
    welfare: welfareCollection,  // ← 必须注册
16
};

1
---
2
import { getEntry, render } from "astro:content";
3
import Markdown from "@components/common/Markdown.astro";
4
import MainGridLayout from "@/layouts/MainGridLayout.astro";
5

6
const post = await getEntry("welfare", "rural-education"); // 修改 slug
7

8
if (!post) {
9
    throw new Error("Page not found");
10
}
11

12
const { Content } = await render(post);
13
---
14

15
<MainGridLayout title={post.data.title} description={post.data.description}>
16
    <div class="flex w-full rounded-(--radius-large) overflow-hidden relative min-h-32">
17
        <div class="card-base z-10 px-9 py-6 relative w-full">
18
            <Markdown class="mt-2">
19
                <Content />
20
            </Markdown>
21
        </div>
22
    </div>
23
</MainGridLayout>