卡片栏配置

homeCardSort

• 类型：("topArticle" | "category" | "tag" | "friendLink" | "docAnalysis")[]
• 默认值：["topArticle", "category", "tag", "friendLink", "docAnalysis"]

首页卡片的位置排序，当设置了 homeCardSort 但没有全部补全内容，Teek 会将剩余内容按照 homeCardSort 的顺序进行添加。

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  homeCardSort: ['topArticle', 'category', 'tag', 'friendLink', 'docAnalysis'],
})

index.md

---
tk:
  homeCardSort:
    - topArticle
    - category
    - tag
    - friendLink
    - docAnalysis
---

tagColor v1.1.5

• 类型：string[]
• 默认值：

[
  { "border": "#bfdbfe", "bg": "#eff6ff", "text": "#2563eb" },
  { "border": "#e9d5ff", "bg": "#faf5ff", "text": "#9333ea" },
  { "border": "#fbcfe8", "bg": "#fdf2f8", "text": "#db2777" },
  { "border": "#a7f3d0", "bg": "#ecfdf5", "text": "#059669" },
  { "border": "#fde68a", "bg": "#fffbeb", "text": "#d97706" },
  { "border": "#a5f3fc", "bg": "#ecfeff", "text": "#0891b2" },
  { "border": "#c7d2fe", "bg": "#eef2ff", "text": "#4f46e5" }
]

标签背景色，用于精选文章卡片的 top + sticky 功能和标签卡片的标签，背景色按顺序显示。

当在文章页的 frontmatter 配置时，如果颜色值有 # 号时请添加引号。

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  bgColor: ['#e74c3c', '#409EFF', '#DAA96E', '#0C819F', '#27ae60', '#ff5c93', '#fd726d', '#f39c12', '#9b59b6'],
})

index.md

---
tk:
  bgColor:
    - '#e74c3c'
    - '#409EFF'
    - '#DAA96E'
    - '#0C819F'
    - '#27ae60'
    - '#ff5c93'
    - '#fd726d'
    - '#f39c12'
    - '#9b59b6'
---

blogger

博主信息，显示在首页左边第一个卡片。

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  blogger: {
    name: '天客', // 博主昵称
    avatar: 'https://testingcf.jsdelivr.net/gh/Kele-Bingtang/static/user/avatar1.png', // 博主头像
    slogan: '朝圣的使徒，正在走向编程的至高殿堂！', // 博主签名
    shape: 'square', // 头像风格：square 为方形头像，circle 为圆形头像，circle-rotate 可支持鼠标悬停旋转，circle-rotate-last 将会持续旋转 59s
  },
})

index.md

---
tk:
  blogger:
    name: 天客
    avatar: https://testingcf.jsdelivr.net/gh/Kele-Bingtang/static/user/avatar1.png
    slogan: 朝圣的使徒，正在走向编程的至高殿堂！
    shape: square
---

更多配置项

interface Blogger {
  /**
   * 博主昵称
   */
  name: string
  /**
   * 博主头像
   */
  avatar: string
  /**
   * 博主签名
   */
  slogan?: string
  /**
   * 头像风格：square 为方形头像，circle 为圆形头像，circle-rotate 可支持鼠标悬停旋转，circle-rotate-last 将会持续旋转 59s
   *
   * @default 'square'
   */
  shape?: TkAvatarProps['shape'] | 'circle-rotate'
  /**
   * 背景图片地址，仅当 shape 为 circle 相关值时有效
   *
   * @since v1.1.5
   */
  circleBgImg?: string
}

topArticle

精选文章卡片配置。

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  topArticle: {
    enabled: true, // 是否启用精选文章卡片
    limit: 5, // 一页显示的数量
    autoPage: false, // 是否自动翻页
    pageSpeed: 4000, // 翻页间隔时间，单位：毫秒。autoPage 为 true 时生效
    dateFormat: 'yyyy-MM-dd hh:mm:ss', // 精选文章的日期格式
  },
})

index.md

---
tk:
  topArticle:
    enabled: true
    limit: 5
    autoPage: false
    pageSpeed: 4000
---

更多配置项

import type { VpRouter } from '@teek/composables'

interface TopArticle {
  /**
   * 是否启用精选文章卡片
   *
   * @default true
   */
  enabled?: boolean
  /**
   * 首页卡片标题
   *
   * @default '${icon}精选文章'
   */
  title?: string | ((icon: string) => string)
  /**
   * 精选文章为空时的标签
   *
   * @default '暂无精选文章'
   */
  emptyLabel?: string
  /**
   * 一页显示的数量
   *
   * @default 5
   */
  limit?: number
  /**
   * 是否自动翻页
   *
   * @default false
   */
  autoPage?: boolean
  /**
   * 翻页间隔时间，单位：毫秒。autoPage 为 true 时生效
   *
   * @default 4000 (4秒)
   */
  pageSpeed?: number
  /**
   * 精选文章的日期格式
   *
   * @default 'yyyy-MM-dd hh:mm:ss'
   */
  dateFormat?: 'yyyy-MM-dd' | 'yyyy-MM-dd hh:mm:ss' | ((date: number | string) => string)
  /**
   * 点击标题时触发，可以通过 router.go 跳转到其他页面，也可以通过 window.open 打开新窗口
   *
   * @since v1.1.2
   */
  titleClick?: (router: VpRouter) => void
}

category

分类卡片配置。

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  category: {
    enabled: true, // 是否启用分类卡片
    limit: 5, // 一页显示的数量
    autoPage: false, // 是否自动翻页
    pageSpeed: 4000, // 翻页间隔时间，单位：毫秒。autoPage 为 true 时生效
  },
})

index.md

---
tk:
  category:
    enabled: true
    limit: 5
    autoPage: false
    pageSpeed: 4000
---

更多配置项

interface Category {
  /**
   * 是否启用分类卡片
   *
   * @default true
   */
  enabled?: boolean
  /**
   * 分类页访问地址
   *
   * @default '/categories'
   */
  path?: string
  /**
   * 分类页卡片标题
   *
   * @default '${icon}全部分类'
   */
  pageTitle?: string | ((icon: string) => string)
  /**
   * 首页卡片标题
   *
   * @default '${icon}文章分类'
   */
  homeTitle?: string | ((icon: string) => string)
  /**
   * 查看更多分类标签
   *
   * @default '更多 ...'
   */
  moreLabel?: string
  /**
   * 分类为空时的标签
   *
   * @default '暂无文章分类'
   */
  emptyLabel?: string
  /**
   * 一页显示的数量
   *
   * @default 5
   */
  limit?: number
  /**
   * 是否自动翻页
   *
   * @default false
   */
  autoPage?: boolean
  /**
   * 翻页间隔时间，单位：毫秒。autoPage 为 true 时生效
   *
   * @default 4000 (4秒)
   */
  pageSpeed?: number
}

tag

标签卡片配置。

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  tag: {
    enabled: true, // 是否启用标签卡片
    limit: 21, // 一页显示的数量
    autoPage: false, // 是否自动翻页
    pageSpeed: 4000, // 翻页间隔时间，单位：毫秒。autoPage 为 true 时生效
  },
})

index.md

---
tk:
  tag:
    enabled: true
    limit: 5
    autoPage: false
    pageSpeed: 4000
---

更多配置项

interface Tag {
  /**
   * 是否启用标签卡片
   *
   * @default true
   */
  enabled?: boolean
  /**
   * 标签页访问地址
   *
   * @default '/tags'
   */
  path?: string
  /**
   * 标签页页卡片标题
   *
   * @default '${icon}全部标签'
   */
  pageTitle?: string | ((icon: string) => string)
  /**
   * 首页卡片标题
   *
   * @default '${icon}热门标签'
   */
  homeTitle?: string | ((icon: string) => string)
  /**
   * 查看更多分类标签
   *
   * @default '更多 ...'
   */
  moreLabel?: string
  /**
   * 标签为空时的标签
   *
   * @default '暂无标签'
   */
  emptyLabel?: string
  /**
   * 一页显示的数量
   *
   * @default 21
   */
  limit?: number
  /**
   * 是否自动翻页
   *
   * @default false
   */
  autoPage?: boolean
  /**
   * 翻页间隔时间，单位：毫秒。autoPage 为 true 时生效
   *
   * @default 4000 (4秒)
   */
  pageSpeed?: number
}

friendLink

友情链接卡片配置。

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  friendLink: {
    enabled: true, // 是否启用友情链接卡片
    list: [
      {
        name: 'Teeker',
        desc: '朝圣的使徒，正在走向编程的至高殿堂！',
        avatar: 'https://testingcf.jsdelivr.net/gh/Kele-Bingtang/static/user/avatar2.png',
        link: 'http://notes.teek.top/',
      },
      {
        name: 'vuepress-theme-vdoing',
        desc: '🚀一款简洁高效的VuePress 知识管理&博客 主题',
        avatar: 'https://doc.xugaoyi.com/img/logo.png',
        link: 'http://notes.teek.top/',
      },
      {
        name: 'vuepress-theme-vdoing',
        desc: '🚀一款简洁高效的VuePress 知识管理&博客 主题',
        avatar: 'https://doc.xugaoyi.com/img/logo.png',
        link: 'https://doc.xugaoyi.com/',
      },
      {
        name: 'One',
        desc: '明心静性，爱自己',
        avatar: 'https://onedayxyy.cn/img/xyy-touxiang.png',
        link: 'https://onedayxyy.cn/',
      },
      {
        name: 'Hyde Blog',
        desc: '人心中的成见是一座大山',
        avatar: 'https://teek.seasir.top/avatar/avatar.webp',
        link: 'https://teek.seasir.top/',
      },
      {
        name: '二丫讲梵',
        desc: '💻学习📝记录🔗分享',
        avatar: 'https://wiki.eryajf.net/img/logo.png',
        link: ' https://wiki.eryajf.net/',
      },
    ], // 友情链接数据列表
    limit: 5, // 一页显示的数量
    autoScroll: false, // 是否自动滚动
    scrollSpeed: 2500, // 滚动间隔时间，单位：毫秒。autoScroll 为 true 时生效
    autoPage: false, // 是否自动翻页
    pageSpeed: 4000, // 翻页间隔时间，单位：毫秒。autoPage 为 true 时生效
  },
})

index.md

---
tk:
  friendLink:
    enabled: true
    list:
      - name: 测试1
        desc: 这是一个友链测试1
        avatar: /img/bg1.jpg
        link: https://github.com/Kele-Bingtang
      - name: 测试2
        desc: 这是一个友链测试2222111啊
        avatar: /img/ui.png
    limit: 5
    autoScroll: false
    scrollSpeed: 2500
    autoPage: false
    pageSpeed: 4000
---

更多配置项

import type { VpRouter } from 'vitepress-theme-teek'

interface FriendLink {
  /**
   * 是否启用友情链接卡片
   *
   * @default true
   */
  enabled?: boolean
  /**
   * 友情链接数据列表
   */
  list?: {
    /**
     * 友链名称
     */
    name: string
    /**
     * 友链头像
     */
    avatar?: string
    /**
     * 友链描述
     */
    desc?: string
    /**
     * 友链链接
     */
    link?: string
    /**
     * img 标签的 alt
     *
     * @default name
     */
    alt?: string
  }[]
  /**
   * 首页卡片标题
   *
   * @default '${icon}友情链接'
   */
  title?: string | ((icon: string) => string)
  /**
   * 友情链接为空时的标签
   *
   * @default '暂无友情链接'
   */
  emptyLabel?: string
  /**
   * 一页显示的数量
   *
   * @default 5
   */
  limit?: number
  /**
   * 是否自动滚动
   *
   * @default false
   */
  autoScroll?: boolean
  /**
   * 滚动间隔时间，单位：毫秒。autoScroll 为 true 时生效
   *
   * @default 2500 (2.5秒)
   */
  scrollSpeed?: number
  /**
   * 是否自动翻页
   *
   * @default false
   */
  autoPage?: boolean
  /**
   * 翻页间隔时间，单位：毫秒。autoPage 为 true 时生效
   *
   * @default 4000 (4秒)
   */
  pageSpeed?: number
  /**
   * 点击标题时触发，可以通过 router.go 跳转到其他页面，也可以通过 window.open 打开新窗口
   *
   * @since v1.1.2
   */
  titleClick?: (router: VpRouter) => void
}

docAnalysis

站点信息卡片配置。

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  docAnalysis: {
    enabled: true,
    createTime: '2021-10-19',
    wordCount: true,
    readingTime: true,
    statistics: {
      provider: 'busuanzi',
      siteView: true,
      pageView: true,
    },
    overrideInfo: [
      {
        key: 'lastActiveTime',
        label: '活跃时间',
        value: (_, currentValue) => (currentValue + '').replace('前', ''),
        show: true,
      },
    ],
    appendInfo: [{ key: 'index', label: '序号', value: '天客 99' }],
  },
})

index.md

---
tk:
  docAnalysis:
    enabled: true
    createTime: 2021-10-19
    wordCount: true
    readingTime: true
    statistics:
      provider: 'busuanzi'
      siteView: true
      pageView: true
    appendInfo:
      - key: 'index'
        label: '序号'
        value: '天客 99'
---

更多配置项

interface DocAnalysis {
  /**
   * 是否启用站点信息卡片
   *
   * @default true
   */
  enabled?: boolean
  /**
   * 首页卡片标题
   *
   * @default '${icon}站点信息'
   */
  title?: string | ((icon: string) => string)
  /**
   * 项目创建时间
   */
  createTime?: string
  /**
   * 是否开启文章页的字数统计
   *
   * @default true
   */
  wordCount?: boolean
  /**
   * 是否开启文章页的阅读时长统计
   *
   * @default true
   */
  readingTime?: boolean
  /**
   * 访问量、访客数统计配置
   */
  statistics?: {
    /**
     * 统计服务提供商
     *
     * @default ''
     */
    provider?: '' | 'busuanzi'
    /**
     * 是否开启首页的访问量和排名统计
     *
     * @default true
     */
    siteView?: boolean
    /**
     * 是否开启文章页的浏览量统计
     *
     * @default true
     */
    pageView?: boolean
    /**
     * 如果请求不蒜子接口失败，是否重试，类型 boolean
     *
     * @default false
     */
    tryRequest?: boolean
    /**
     * 重试次数，仅当 tryRequest 为 true 时有效
     *
     * @default 5
     */
    tryCount?: number
    /**
     * 重试间隔时间，单位毫秒，仅当 tryRequest 为 true 时有效
     *
     * @default 2000
     */
    tryIterationTime?: number
    /**
     * 是否只统计永久链接的浏览量，如果为 false，则统计 VitePress 默认的文档目录链接
     *
     * @default true
     */
    permalink?: boolean
  }
  /**
   * 自定义现有信息
   * originValue 为计算前的数据，currentValue 为计算后的数据（加单位的数据），针对 lastActiveTime 这些需要判断 N 分、N 时、N 天的 key，originValue 为具体的时间，需要自行计算
   */
  overrideInfo?: (Omit<PartialKey<DocAnalysisInfo, 'label'>, 'value'> & {
    value?: (originValue: string | number, currentValue?: string | number) => string
  })[]
  /**
   * 自定义额外信息，类型和 overrideInfo 一样
   * @default []
   */
  appendInfo?: (Omit<DocAnalysisInfo, 'key'> & { key: string })[]
}

interface DocAnalysisInfo {
  /**
   * 站点信息唯一标识
   */
  key: 'totalPosts' | 'weekAddNum' | 'monthAddNum' | 'runtime' | 'totalWordCount' | 'lastActiveTime' | 'viewCount' | 'visitCount' | string
  /**
   * 站点信息标签
   */
  label: string
  /**
   * 站点信息值的描述
   */
  value: string
  /**
   * 是否显示在站点信息
   *
   * @default true
   */
  show?: boolean
}

提示

如果想开启访问量、访客数统计，请使用 statistics 配置项，目前支持 busuanzi 统计方式。

当想修改站点信息内置的信息时，可以使用 overrideInfo 配置项，该配置项是一个数组对象，对象的 key 为信息标识，value 是一个函数，接收两个参数 originValue 和 currentValue：

• originValue：站点信息卡片的原始值，如创建时间为 2021-10-19
• currentValue：站点信息卡片当前渲染的值，如创建时间渲染的值为 N 天前

比如想将 文章数目 改为 文章总数目：

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  docAnalysis: {
    overrideInfo: [{ key: 'totalPosts', label: '文章总数目' }],
  },
})

比如想隐藏最后活动时间：

config.mts

// .vitepress/config.mts
import { defineTeekConfig } from 'vitepress-theme-teek/config'

const teekConfig = defineTeekConfig({
  docAnalysis: {
    overrideInfo: [{ key: 'lastActiveTime', show: false }],
  },
})

key 可选值如下：

• totalPosts：文章总数
• weekAddNum：近一周新增
• monthAddNum：近一月新增
• runtime：已运行时间
• totalWordCount：本站总字数
• lastActiveTime：最后活动时间
• viewCount：本站被访问了
• visitCount：本站曾来访过