mirror of
https://github.com/pengzhanbo/vuepress-theme-plume.git
synced 2026-04-23 10:58:13 +08:00
103 lines
3.3 KiB
Markdown
103 lines
3.3 KiB
Markdown
---
|
|
title: 博客
|
|
author: pengzhanbo
|
|
icon: material-symbols:article-outline
|
|
createTime: 2024/03/04 19:16:40
|
|
permalink: /guide/blog/
|
|
tags:
|
|
- 指南
|
|
- 快速开始
|
|
---
|
|
|
|
<script setup lang="ts">
|
|
import VPBlogProfile from 'vuepress-theme-plume/components/Blog/VPBlogProfile.vue'
|
|
</script>
|
|
|
|
## 概述
|
|
|
|
主题默认启用 博客功能，通常您无需进行额外的配置。
|
|
|
|
主题默认会将 `{sourceDir}` 目录下的，除了一些特定的目录（如 `notes` 目录将作为笔记所在目录），
|
|
所有 md 文件作为博客文章。
|
|
|
|
同时，主题会生成一个 链接地址为 `/blog/` 的 博客文章列表页。
|
|
展示所有的博客文章，以及 博主的相关信息。
|
|
|
|
## 国际化支持
|
|
|
|
如果启用了 国际化，那么博客列表页将会 根据 不同的语言，展示对应语言目录下的博客列表。
|
|
即 每个语言下的 文章列表 都是保持独立的。
|
|
|
|
## 博主信息
|
|
|
|
主题支持展示博主的基本信息。
|
|
|
|
<div
|
|
style="width: 310px;margin: 0 auto;padding: 20px 20px 1px;text-align:center;border-radius: 4px;
|
|
background-color: var(--vp-c-bg-soft);transition: background-color var(--t-color);"
|
|
>
|
|
<VPBlogProfile />
|
|
</div>
|
|
|
|
### 配置
|
|
|
|
你可以通过 `profile` 属性来设置博主头像等相关信息。
|
|
|
|
::: code-tabs
|
|
@tab .vuepress/config.ts
|
|
|
|
```ts
|
|
export default defineUserConfig({
|
|
theme: plumeTheme({
|
|
profile: {
|
|
name: '你的名字',
|
|
description: '描述文字',
|
|
avatar: '/blogger.png',
|
|
circle: true, // 是否为圆形头像
|
|
}
|
|
})
|
|
})
|
|
```
|
|
|
|
:::
|
|
|
|
## 文章元数据
|
|
|
|
你可以配置展示博客文章的元数据，如标题、作者、日期、标签等。这些数据通过 `frontmatter` 配置。
|
|
|
|
```md
|
|
---
|
|
title: 文章标题
|
|
createTime: 2024/01/01 00:00:00
|
|
author: your name
|
|
tags:
|
|
- tag1
|
|
- tag2
|
|
---
|
|
```
|
|
|
|
其中，`title` / `createTime` / `author` 会在新建 md 文件时由主题自动填充，你可以随意修改它们。
|
|
|
|
以下是在 博客文章中可用的 `frontmatter` 属性。
|
|
|
|
| 属性 | 类型 | 默认值 | 说明 |
|
|
| ---------- | ------------------- | --------------------------- | -------------------------------------------- |
|
|
| title | `string` | 默认自动填入文件名 | 文章标题 |
|
|
| createTime | `string` | 当前时间 | 文章创建时间 |
|
|
| author | `string` | 默认自动填入 `profile.name` | 文章作者 |
|
|
| tags | `string[]` | `[]` | 文章标签 |
|
|
| sticky | `boolean \| number` | false | 是否置顶, 如果为数字，则数字越大，置顶越靠前 |
|
|
| draft | `boolean` | false | 是否为草稿，草稿文章不会被展示 |
|
|
|
|
## 文章摘要
|
|
|
|
如果你想要为文章添加摘要，你可以使用 `<!-- more -->` 注释来标记它。任何在此注释之前的内容会被视为摘要。
|
|
|
|
## 标签页和归档页
|
|
|
|
主题除了自动生成 **博客文章列表页** 以外，还会自动生成 **标签页** 和 **归档页**。
|
|
|
|
标签页 可以根据 标签 筛选并展示 博客文章。
|
|
|
|
归档页根据文章的创建时间进行归档。
|