页脚配置

social

社交信息配置，通常为一个社交图标，点击后将会跳转到社交软件的个人主页。

提示

social 在卡片栏的博主信息区和页脚都会生效。

config.mts

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

const teekConfig = defineTeekConfig({
  social: [
    {
      icon: "mdi:github",
      name: "GitHub",
      link: "https://github.com/kele-bingtang",
    },
    {
      icon: "simple-icons:gitee",
      name: "Gitee",
      link: "https://gitee.com/kele-bingtang",
    },
  ],
});

index.md

---
tk:
  social:
    - icon: mdi:github
      name: GitHub
      link: https://github.com/kele-bingtang
    - icon: simple-icons:gitee
      name: Gitee
      link: https://gitee.com/kele-bingtang
---

更多配置项

import type { IconProps } from "vitepress-theme-teek";

interface Social {
  /**
   * 名称，如果作用在 a 标签，则鼠标悬停显示名称，否则在页面文字显示
   */
  name?: string;
  /**
   * 图标地址
   *
   * @remark 与 iconType 配合使用
   */
  icon?: IconProps["icon"];
  /**
   * 图标类型
   *
   * @default 'svg'
   */
  iconType?: IconProps["iconType"];
  /**
   * 链接，点击后跳转到新窗口，如果不设置，则无法点击
   */
  link?: string;
  /**
   * img 标签的 alt，当 iconType 为 img 时生效
   */
  imgAlt?: string;
}

icon 配置项为 Icon 图标 组件的配置项。

footerInfo

页脚配置，不会影响 VitePress 自带的页脚功能。

配置项中的 Social 类型为 Social 配置项。

config.mts

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

const teekConfig = defineTeekConfig({
  footerInfo: {
    // 页脚信息，支持 HTML 格式（位于主题版权上方）
    topMessage: ["下面的内容和图标都可以修改（本条内容也可以隐藏的）"],
    // 页脚信息，支持 HTML 格式（位于主题版权下方）
    bottomMessage: ["上面的内容和图标都可以修改（本条内容也可以隐藏的）"],
    // 主题版权配置
    theme: {
      show: true, // 是否显示主题版权，建议显示
      name: "", // 自定义名称
      link: "", // 自定义链接
    },
    // 博客版权配置
    copyright: {
      show: true, // 是否显示博客版权
      createYear: 2021, // 创建年份
      suffix: "天客 Blog", // 后缀
    },
    // ICP 备案信息配置
    icpRecord: {
      name: "桂ICP备2021009994号",
      link: "http://beian.miit.gov.cn/",
    },
    // 网络安全备案信息配置
    securityRecord: {
      name: "",
      link: "",
    },
  },
});

index.md

---
tk:
  footerInfo:
    message:
      - 下面的内容都可以修改（本条内容也可以隐藏的）
    copyright:
      createYear: 2021
      suffix: 天客 Blog
    icpRecord:
      name: 桂ICP备2021009994号
      link: http://beian.miit.gov.cn/
---

更多配置项

interface FooterInfo {
  /**
   * 页脚信息，支持 HTML 格式（位于主题版权上方）
   */
  topMessage?: string | string[];
  /**
   * 页脚信息，支持 HTML 格式（位于主题版权下方）
   */
  bottomMessage?: string | string[];
  /**
   * 主题版权配置
   */
  theme?: Social & {
    /**
     * 是否显示
     */
    show?: boolean;
  };
  /**
   * 博客版权配置
   */
  copyright?: Social & {
    /**
     * 是否显示
     */
    show?: boolean;
    /**
     * 创建年份
     */
    createYear?: number | string;
    /**
     * 后缀
     */
    suffix?: string;
  };
  /**
   * ICP 备案信息配置
   */
  icpRecord?: Social;
  /**
   * 网络安全备案信息配置
   */
  securityRecord?: Social;
  /**
   * 自定义 HTML 片段
   */
  customHtml?: string;
}

提示

虽然 Teek 允许通过 theme.show = false 不显示主题版权信息，但是希望大家还是展示 😄。

footerGroup

页脚信息组配置。

config.mts

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

const teekConfig = defineTeekConfig({
  footerGroup: [
    {
      title: "外部链接",
      links: [
        { name: "示例 1", link: "https://vp.teek.top" },
        { name: "示例 2", link: "https://vp.teek.top" },
        { name: "示例 3", link: "https://vp.teek.top" },
      ],
    },
    {
      title: "内部链接",
      links: [
        { name: "快速开始", link: "/guide/quickstart" },
        { name: "配置简介", link: "/reference/config" },
      ],
    },
  ],
});

index.md

---
tk:
  footerGroup:
    - title: 外部链接
      links:
        - name: 示例 1
          link: https://vp.teek.top
        - name: 示例 2
          link: https://vp.teek.top
        - name: 示例 3
          link: https://vp.teek.top
    - title: 内部链接
      links:
        - name: 快速开始
          link: /guide/quickstart
        - name: 配置简介
          link: /reference/config
---

更多配置项

import type { IconProps } from "vitepress-theme-teek";

interface FooterGroup {
  /**
   * 分组标题
   */
  title?: string;
  /**
   * 分组前图标
   */
  icon?: IconProps["icon"];
  /**
   * 分组下的链接数组
   */
  links: FooterGroupLink[];
}

interface FooterGroupLink {
  /**
   * 链接名称
   */
  name?: string;
  /**
   * 链接地址
   */
  link?: string;
  /**
   * 链接前图标
   */
  icon?: IconProps["icon"];
}