xane

Firefly 简单使用指南

Tue, 14 Jul 2026 00:00:00 GMT

这个博客模板是基于 Astro 构建的。对于本指南中未提及的内容，您可以在 Astro 文档中找到答案。

文章的 Front-matter#

1
---
2
title: 我的第一篇博客文章
3
published: 2026-07-14
4
description: 这是我新 Astro 博客的第一篇文章。
5
image: ./cover.jpg
6
tags: [前端, 开发]
7
category: 前端开发
8
draft: false
9
---

属性	描述
`title`	文章标题。
`published`	文章发布日期。
`updated`	文章更新日期。如果未设置，将默认使用发布日期。
`pinned`	是否将此文章置顶在文章列表顶部。
`description`	文章的简短描述。显示在首页上。
`image`	文章封面图片路径。 1. 以 `http://` 或 `https://` 开头：使用网络图片 2. 以 `/` 开头：`public` 目录中的图片 3. 不带任何前缀：相对于 markdown 文件的路径
`tags`	文章标签。
`category`	文章分类。
`lang`	文章语言代码（如 `zh-CN`）。仅当文章语言与站点默认语言不同时设置。
`licenseName`	文章内容的许可证名称。
`licenseUrl`	文章内容的许可证链接。
`author`	文章作者。
`sourceLink`	文章内容的来源链接或参考。
`draft`	如果这篇文章仍是草稿，则不会显示。
`comment`	是否启用此文章的评论功能。默认为 `true`。
`slug`	自定义文章 URL 路径。如果不设置，将使用文件名作为 URL。
`password`	文章密码。设置后文章内容将被 AES-256-GCM 加密，访客需输入密码才能查看。
`passwordHint`	密码提示。显示在密码输入框上方，帮助访客回忆密码，也可以不加。

文章文件的放置位置#

您的文章文件应放置在 src/content/posts/ 目录中。您也可以创建子目录来更好地组织您的文章和资源。

1
src/content/posts/
2
├── post-1.md
3
└── post-2/
4
    ├── cover.png
5
    └── index.md

自定义文章 URL (Slug)#

什么是 Slug？#

Slug 是文章 URL 路径的自定义部分。如果不设置 slug，系统将使用文件名作为 URL。

Slug 使用示例#

示例 1：使用文件名作为 URL#

1
---
2
title: 我的第一篇博客文章
3
published: 2023-09-09
4
---

文件：src/content/posts/my-first-blog-post.md

URL：/posts/my-first-blog-post

示例 2：自定义 Slug#

1
---
2
title: 我的第一篇博客文章
3
published: 2023-09-09
4
slug: hello-world
5
---

文件：src/content/posts/my-first-blog-post.md

URL：/posts/hello-world

示例 3：其他语言文件名使用Slug#

1
---
2
title: 如何使用 Firefly 博客主题
3
published: 2023-09-09
4
slug: how-to-use-firefly-blog-theme
5
---

文件：src/content/posts/如何使用Firefly博客主题.md

URL：/posts/how-to-use-firefly-blog-theme

Slug 使用建议#

使用英文和连字符：my-awesome-post 而不是 my awesome post
保持简洁：避免过长的 slug
具有描述性：让 URL 能够反映文章内容
避免特殊字符：只使用字母、数字和连字符
保持一致性：在整个博客中使用相似的命名模式

注意事项#

Slug 一旦设置并发布，建议不要随意更改，以免影响 SEO 和已存在的链接
如果多个文章使用相同的 slug，后面的文章会覆盖前面的
Slug 会自动转换为小写

开源的文章管理器—PagesCMS

Wed, 22 Jul 2026 00:00:00 GMT

PagesCMS原理与使用教程）#

Pages CMS 是一个轻量级、基于 Git（Git-based） 的开源无头内容管理系统（Headless CMS）。它没有传统的独立数据库，而是直接把你的 GitHub 仓库 作为数据源。

一、 Pages CMS 的底层工作原理#

Pages CMS 的核心逻辑可以总结为：

可视化界面 → GitHub API → 触发 Git Commit → 自动构建部署

1
[ 用户在 Pages CMS 后台操作 ]
2

3
             │
4

5
             ▼ (通过 GitHub OAuth 授权)
6

7
[ Pages CMS 调用 GitHub API ]
8

9
             │
10

11
             ▼ (在你的仓库进行文件读写)
12

13
[ 仓库 src/content/posts/ 产生变动 (Commit) ]
14

15
             │
16

17
             ▼ (Webhooks 自动触发)
18

19
[ Vercel / Cloudflare Pages / GitHub Pages ]
20

21
             │
22

23
             ▼ (执行 astro build)

展开收起

二、使用教程#

Step 1. 准备配置文件#

访问你的 GitHub 博客仓库，在仓库根目录下创建一个新文件，命名为 .pages.yml。

Step 2. 连接并配置后台#

访问 Pages CMS 官网，使用 GitHub 账号登录。
登录后选择你的博客仓库。
首次使用需要配置：点击左侧导航栏的 Configuration 选项卡，输入以下 YAML 配置代码并保存

1
content:
2
  - name: posts
3
    label: 文章列表
4
    type: collection
5
    path: src/content/posts
6
    filename: "{slug}.md"
7
    view:
8
      fields: [title, published, category, sticky, draft] # 在后台列表中加上 sticky 列，方便一眼看到置顶状态
9
      search: [title, description, tags, category]
10
      sort: [published]
11
      order: desc
12

13
    fields:
14
      - name: title
15
        label: 文章标题
16
        type: string
17
        required: true
18

19
      - name: published
20
        label: 发布时间
21
        type: date
22
        options:
23
          format: yyyy-MM-dd
24
        required: true
25

26
      - name: description
27
        label: 文章描述
28
        type: text
29

30
      - name: image
31
        label: 封面图 (图床 URL)
32
        type: string
33

34
      - name: tags
35
        label: 标签
36
        type: string
37
        list: true
38

39
      - name: category
40
        label: 分类
41
        type: string
42

43
      - name: sticky
44
        label: 是否置顶
45
        type: boolean
46
        default: false # 默认不置顶
47

48
      - name: draft
49
        label: 是否草稿
50
        type: boolean
51
        default: false
52

53
      - name: body
54
        label: 文章正文
55
        type: rich-text

展开收起

保存完成后，你就可以像使用动态博客一样，优雅地在网页端撰写和编辑博客了！

其实你现在看到的这篇博文，就是直接用 PagesCMS 编写并发布的

我的博客发展史

Wed, 15 Jul 2026 00:00:00 GMT

Wordpress#

WordPress

在刚刚接触博客的时候，我选择了插件和主题最丰富的博客框架Wordpress
Wordpress上手很简单，在当时领取了一台InfinityFree的免费虚拟主机
装上Wordpress后玩的很是开心，但后来发现访问速度实在是太慢了
因为Wordpress实在是太臃肿了，我的免费虚拟主机根本带不动，于是我开始搜寻其他轻便的博客框架也就是下面的Typecho

Typecho#

Typecho

于是我又寻找到这个轻便的博客框架Typecho
这是一款非常优秀的博客框架
安装包不到500k刚好解决了我的需求
虽然不像Wordpress那样有官方的主题商店和插件商店
但Typecho的第三方资源十分丰富且高质我曾经以为我会用一辈子Typecho 因为在当时看来，这已经是我目前接触到得最满意的博客框架
然而Astro打破了我的幻想

Astro#

Astro

当时第一眼看到这个博客框架的时候
我惊呆了，竟然能有一个博客框架在兼顾运行速度的同时保持了这么美观的界面还有丰富的功能
我立马开始了对Astro的研究
但发现，搭建其实有一点难度需要在Cloudflare、Github两个平台之间来回切换
在研究半天之后，我终于搞好了，还用了Firefly主题
搞好之后，我开始修改个人信息等等东西
但最让我绝望的是，修改完成后同步不到仓库
每次git都会失败，后面才发现原来是网络的问题
在网络问题解决好之后，我发布了我的第一篇文章
也就是本篇

吐槽一下：我Markdown还是好生疏