Skip to content

frontmatter 配置

frontmatter 支持基于页面的配置。在每个 Markdown 文件中,可以使用 frontmatter 配置来覆盖 主题配置 中的大部分选项。

首页配置

description

Teek 提供了 description 选项,用于在首页 Banner 展示一些描述信息,您可以通过 tk.description 或者 tk.banner.description 来配置首页的 description

提示

description 获取优先级:tk.banner.description > banner.description > tk.description >。

yaml
---
layout: home

tk:
  description:
    - 故事由我书写,旅程由你见证,传奇由她聆听 —— 来自 Young Kbt
    - 积跬步以至千里,致敬每个爱学习的你 —— 来自 Evan Xu
    - 这一生波澜壮阔或是不惊都没问题 —— 来自 Weibw
---

features

Teek 提供了 features 选项,用于在首页 Banner 展示一些功能介绍,且为了不与 VitePress 的 features 冲突,所以 Teek 提供了 tk.features 或者 tk.banner.features 来配置首页的 features

提示

features 获取优先级:tk.banner.features > banner.features > tk.features >。

yaml
---
layout: home

tk:
  features:
    - title: 指南
      description: Hd Security 使用指南说明
      link: /01.指南/
      imgUrl: /img/web.png
    - title: 设计
      description: Hd Security 设计思路说明
      link: /design/
      imgUrl: /img/ui.png
    - title: API
      description: Hd Security 所有的 API 介绍
      link: /07.API/01.API - 登录/
      imgUrl: /img/other.png
---

主题配置

在首页 index.mdfrontmatter,可以覆盖 config 主题配置的首页相关选项:

  • banner 横幅
  • topArticle 精选文章
  • category 分类
  • tag 标签
  • friendLink 友情链接
  • docAnalysis 站点分析
  • post 文章列表
  • article 文章信息(作者、创建时间、分类、标签等)
  • page 分页
  • ...

在首页 index.mdfrontmatter 中配置时,建议以 tk 开头,然后是主题配置的选项,举个示例:

yaml
---
tk:
  banner:
    enabled: true
    bgStyle: fullImg
    imgSrc:
      - /img/bg1.jpg
      - /img/bg2.jpg
  category:
    enabled: true
    limit: 7
  article:
    showIcon: false
  page:
    pageSize: 20
---

这些配置将会覆盖 config 主题配置中的对应选项。

提示

不以 tk 开头也是可以的,Teek 支持的 frontmatter 既可以是 tk.xx.xx,也可以是 xx.xx,其中 tk.xx.xx 优先级更高。

文章页配置

在文章页的 frontmatter,可以覆盖 config 主题配置的文章页相关选项:

  • author 作者信息
  • article 文章信息(作者、创建时间、分类、标签等)
  • breadcrumb 面包屑
  • articleShare 文章分享
  • appreciation 赞赏
  • ...

在文章页的 frontmatter 中配置时,直接填写 config 主题配置的对应选项,举个示例:

yaml
---
author:
  name: TianKe
  link: https://github.com/Kele-Bingtang/vitepress-theme-teek
article:
  showCategory: true
breadcrumb:
  separator: -
---

文章配置

除了支持覆盖主题配置的选项,Teek 还提供了以下额外的选项:

yaml
---
title: 标题
date: 2025-03-07 01:16:28
permalink: /pages/b1ad26
categories:
  - 分类 1
  - 分类 2
tags:
  - 标签 1
titleTag: 原创
top: true
sticky: 1
sidebar: true
article: true
comment: true
description: 文章摘要
coverImg: /img/web.png
docAnalysis: true
inCatalogue: true
autoTitle: true
articleUpdate: true
inHomePost: true
---

title

  • 类型:string

页面标题,将作为一级标题显示在页面上。

支持填写 HTML 标签 v1.3.0

yaml
---
title: frontmatter 配置 <span style="color:#395AE3">原创</span>
---
yaml
---
title: frontmatter 配置 <Badge type="tip" text="原创" />
---
yaml
---
title: frontmatter 配置 <TkTitleTag type="tip" text="原创" position="right" />
---
yaml
---
title: frontmatter 配置 <TkIcon icon="simple-icons:gitee" color="var(--tk-theme-color)" />
---

除此之外,frontmatter.title 支持所有的基础 HTML 以及已经全局注册的 Vue 组件。

如何注册全局 Vue 组件

.vitepress/theme/index.ts 中的 enhanceApp 函数中进行,通过 app.component("your componentName", your component) 方法进行注册。

date

  • 类型:string

页面创建时间,将作为创建时间显示在首页的文章列表、文章页顶部。

  • 类型:string

页面永久链接,将作为页面访问的 URL 路径,该配置项由 vitepress-plugin-permalink 提供。

categories

  • 类型:string[]

分类,将显示在首页的文章列表、分类卡片、文章页顶部,并在分类页渲染所有分类的文章。

tags

  • 类型:string[]

标签,将显示在首页的文章列表、标签卡片、文章页顶部,并在标签页渲染所有标签的文章。

titleTag v1.1.0

用于给标题添加 原创转载优质推荐 等自定义标记。

添加了标题标记的文章,在文章列表、文章页、归档页、目录页的文章标题都会显示此标记。

除此之外,也可以直接在 frontmatter.title 前后通过 <TkTitleTag> 组件的方式添加标题标记。

yaml
---
title: frontmatter 配置 <TkTitleTag type="tip" text="原创" position="right" />
---
yaml
---
title: <TkTitleTag type="tip" text="原创" position="right" /> frontmatter 配置
---

top

  • 类型:boolean
  • 默认值:false

标记为精选文章。如果为 true,则在首页的精选文章卡片中显示,如果多个文章都设置了 top: true,则按照 date 进行排序(最新时间在上面)。

sticky

  • 类型:number

文章置顶,设置了此项将在首页文章列表中处于置顶位置,如果同时设置了 top: true,则在精选文章卡片的序号添加高亮背景色,背景色请看 主题配置 - tagColor

  • 类型:boolean
  • 默认值:true

侧边栏,true 表示显示侧边栏。设置为 false 表示不显示侧边栏。

article

  • 类型:boolean
  • 默认值:true

非文章页的标记,非文章页如目录页、关于、友情链接等自定义页面,需要设置此项。设置之后这个页面将被认定为非文章页,不显示面包屑和文章信息(作者、时间、分类、标签等),不显示在如下模块中:

  • 首页的文章列表
  • 归档页
  • 文章最近更新栏

comment

  • 类型:boolean
  • 默认值:true

评论功能,true 表示显示评论区。设置为 false 表示不显示评论区。

description

  • 类型:string
  • 默认值:null

文章摘要,将显示在首页的文章列表。

coverImg

  • 类型:string
  • 默认值:null

封面图片,将显示在首页的文章列表。

inCatalogue

  • 类型:boolean
  • 默认值:true

目录页,true 表示允许 Markdown 文档纳入目录里。设置为 false 表示不允许,该配置项由 vitepress-plugin-catalogue 提供。

docAnalysis

  • 类型:boolean
  • 默认值:true

站点分析,true 表示允许站点信息功能对 Markdown 文档进行数据分析和统计。设置为 false 表示不允许,该配置项由 vitepress-plugin-doc-analysis 提供。

autoTitle

  • 类型:boolean
  • 默认值:true

如果 Markdown 不设置一级标题,在访问页面的时候自动添加一级标题。设置为 false 表示不允许自动添加一级标题,该配置项由 vitepress-plugin-md-h1 提供。

一级标题获取优先级:frontmatter.title > 文件名

articleUpdate v1.2.0

  • 类型:boolean
  • 默认值:true

是否在文章底部显示最近更新栏。

inHomePost v1.3.0

  • 类型:boolean
  • 默认值:true

Markdown 文档是否在首页的文章列表中显示。

功能页配置

上述的 frontmatter 配置为通用配置,适用于任何 Markdown 文档。

除此之外,还有一些针对功能页的 frontmatter 局部配置,详细请看 目录页配置功能页配置

最近更新