Skip to content

文章列表配置

文章列表配置

post

文章列表配置,支持在首页 index.mdfrontmatter 配置,格式为 tk.post.[key]

ts
const tkConfig = tkThemeConfig({
  post: {
    excerptPosition: "top", // 文章摘要位置
    showMore: true, // 是否显示更多按钮
    moreLabel: "阅读全文 >", // 更多按钮文字
    coverImgMode: "default", // 文章封面图模式
    showCapture: false, // 是否在摘要位置显示文章部分文字,当为 true 且不使用 frontmatter.describe 和 <!-- more --> 时,会自动截取前 400 个字符作为摘要
  },
});
yaml
---
tk:
  post:
    excerptPosition: top
    showMore: true
    moreLabel: "阅读全文 >"
    coverImgMode: default
    showCapture: false
---
ts
import type { ImageViewerProps } from "element-plus";

interface TkThemeConfig {
  /**
   * 文章列表配置,支持在首页 index.md 的 frontmatter 配置,格式为 tk.post.[key]
   */
  post?: Post;
}

interface Post {
  /**
   * 文章摘要位置
   *
   * @default bottom
   */
  excerptPosition?: "top" | "bottom";
  /**
   * 是否显示更多按钮
   *
   * @default true
   */
  showMore?: boolean;
  /**
   * 更多按钮文字
   *
   * @default '阅读全文 >'
   */
  moreLabel?: string;
  /**
   * 文章封面图模式
   *
   * @default 'default'
   */
  coverImgMode?: "default" | "full";
  /**
   * 是否在摘要位置显示文章部分文字,当为 true 且不使用 frontmatter.describe 和 <!-- more --> 时,会自动截取前 400 个字符作为摘要
   *
   * @default false
   */
  showCapture?: boolean;
  /**
   * 首页的图片查看器配置,完全是 ElImageViewer 的 props
   */
  imageViewer?: Partial<ImageViewerProps>;
}

page

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

支持在首页文档 index.mdfrontmatter 配置,格式为 tk.page.[key]

ts
const tkConfig = tkThemeConfig({
  page: {
    pageSize: 20,
  },
});
yaml
---
tk:
  page:
    pageSize: 20
---
ts
import type { PaginationProps } from "element-plus";
/**
   * 首页 Post 文章列表的分页配置,完全是 ElPagination 的 props,支持在首页文档 index.md 的 frontmatter 配置,格式为 tk.page.[key]
   */
  page?: Partial<PaginationProps>;