文章列表配置

post

文章列表配置。

config.mts

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

const teekConfig = defineTeekConfig({
  post: {
    postStyle: "list", // 文章列表风格
    excerptPosition: "top", // 文章摘要位置
    showMore: true, // 是否显示更多按钮
    moreLabel: "阅读全文 >", // 更多按钮文字
    coverImgMode: "default", // 文章封面图模式
    showCapture: false, // 是否在摘要位置显示文章部分文字，当为 true 且不使用 frontmatter.describe 和 <!-- more --> 时，会自动截取前 300 个字符作为摘要
  },
});

index.md

---
tk:
  post:
    postStyle: list
    excerptPosition: top
    showMore: true
    moreLabel: "阅读全文 >"
    coverImgMode: default
    showCapture: false
---

更多配置项

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

interface Post {
  /**
   * 文章模板风格，list 为列表风格，card 为卡片风格
   *
   * @since v1.1.5
   * @default list
   */
  postStyle?: "list" | "card";
  /**
   * 文章摘要位置
   *
   * @default bottom
   */
  excerptPosition?: "top" | "bottom";
  /**
   * 是否显示更多按钮
   *
   * @default true
   */
  showMore?: boolean;
  /**
   * 更多按钮文字
   *
   * @default '阅读全文 >'
   */
  moreLabel?: string;
  /**
   * 文章列表为空时的标签
   *
   * @default '暂无文章'
   */
  emptyLabel?: string;
  /**
   * 文章封面图模式
   *
   * @default 'default'
   */
  coverImgMode?: "default" | "full";
  /**
   * 是否在摘要位置显示文章部分文字，当为 true 且不使用 frontmatter.describe 和 `<!-- more -->` 时，会自动截取前 300 个字符作为摘要
   *
   * @default false
   */
  showCapture?: boolean;
  /**
   * 文章信息（作者、创建时间、分类、标签等信息）是否添加 | 分隔符
   *
   * @default false
   */
  splitSeparator?: boolean;
  /**
   * 是否开启过渡动画
   *
   * @default true
   */
  transition?: boolean;
  /**
   * 自定义过渡动画名称
   *
   * @default 'tk-slide-fade'
   */
  transitionName?: string;
  /**
   * 列表模式下的标题标签位置（postStyle 为 list）
   *
   * @since v1.1.5
   * @default 'right'
   */
  listStyleTitleTagPosition?: TitleTagProps["position"];
  /**
   * 卡片模式下的标题标签位置（postStyle 为 list）
   *
   * @since v1.1.5
   * @default 'left'
   */
  cardStyleTitleTagPosition?: TitleTagProps["position"];
  /**
   * 默认封面图地址，如果不设置封面图则使用默认封面图地址
   *
   * @since v1.2.1
   * @default []
   */
  defaultCoverImg?: string[];
}

v1.1.5 您可以通过 postStyle 配置项来设置文章列表的风格：

• 当 postStyle 为 list 时，文章列表为列表风格
• 当 postStyle 为 card 时，文章列表为卡片风格，且 excerptPosition、showMore、moreLabel、coverImgMode 配置项失效

page

首页 Post 文章列表的分页配置，完全是 ElPagination 的 props。

config.mts

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

const teekConfig = defineTeekConfig({
  page: {
    pageSize: 20,
  },
});

index.md

---
tk:
  page:
    pageSize: 20
---

更多配置项

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

interface TeekConfig {
  /**
   * 首页 Post 文章列表的分页配置
   */
  page?: {
    /**
     * 总条目数
     */
    total?: number;
    /**
     * 总页数，与 total 二选一
     */
    pageCount?: number;
    /**
     * 设置最大页码按钮数。 页码按钮的数量，当总页数超过该值时会折叠
     *
     * @default 7
     */
    pagerCount?: number;
    /**
     * 组件布局，子组件名用逗号分隔
     *
     * @default 'prev, pager, next, jumper, ->, total'
     */
    layout?: string;
    /**
     * 替代图标显示的上一页文字
     */
    prevText?: string;
    /**
     * 上一页的图标， 比 prev-text 优先级更高
     */
    prevIcon?: IconProps["icon"];
    /**
     * 替代图标显示的下一页文字
     */
    nextText?: string;
    /**
     * 下一页的图标， 比 next-text 优先级更高
     */
    nextIcon?: IconProps["icon"];
    /**
     * 分页大小
     *
     * @default 'default'
     */
    size?: Size;
    /**
     * 是否为分页按钮添加背景色
     *
     * @default false
     */
    background?: boolean;
    /**
     * 是否禁用
     *
     * @default false
     */
    disabled?: boolean;
    /**
     * 只有一页时是否隐藏
     *
     * @default false
     */
    hideOnSinglePage?: boolean;
  };
}