跳转到内容

功能特性

ShokaX 主题提供了丰富的功能特性,帮助你打造独特的博客体验。

主题扩展了 MDX 语法,提供 11 种开箱即用的组件,无需导入即可在文章中使用。

可用组件

  • Note - 5 种颜色的提示框(信息/成功/警告/错误/帮助)
  • Spoiler - 剧透遮罩(!!内容!! 快捷语法)
  • 文本装饰 - Label、Underline、Strike、Highlight、Text、Kbd
  • 上下标 - Sup、Sub
  • 折叠面板 - Collapse

示例

<Note type="info">这是一条信息提示</Note>
水的化学式是 H<Sub>2</Sub>O,能量公式是 E=mc<Sup>2</Sup>
<Collapse title="点击展开更多内容">
隐藏的详细说明...
</Collapse>

查看 MDX 组件文档 →


内置友链页面,支持卡片式展示、站点预览图、自定义主题色。

核心特性

  • 卡片式友链展示,支持鼠标悬停效果
  • 站点预览图(可选)
  • 自定义主题色点缀
  • 自动生成友链配置示例(方便交换友链)
  • 可自定义友链规则说明

配置示例

src/theme.config.ts
friends: {
title: "友链",
links: [
{
url: "https://example.com/",
title: "示例站点",
desc: "站点简介",
author: "作者名",
avatar: "https://example.com/avatar.png",
color: "var(--color-pink)", // 可选
siteImage: "https://example.com/preview.png", // 可选
},
],
}

查看友链配置文档 →


主题支持自定义字体,并内置字体子集化优化功能,大幅减小字体文件体积。

核心特性

  • 快速更换字体(替换字体文件即可,无需修改代码)
  • 字体子集化优化(自动提取使用的文字,10MB → 几百 KB)
  • TTF 格式支持(自动转换为 WOFF 用于生产环境)
  • 单独配置正文字体和代码字体
  • 支持多字体方案(标题/正文使用不同字体)

快速更换字体

  1. 找到 src/assets/fonts/LXGWWenKai-Regular.ttf
  2. 用你的字体文件替换它(保持文件名不变)
  3. 重启开发服务器

默认字体

  • 正文:LXGW WenKai(霞鹜文楷)
  • 代码:Maple Mono CN

查看字体配置文档 →


基于 Pagefind 的快速离线搜索,无需服务器即可实现全文搜索。

核心特性

  • 客户端搜索,快速响应
  • 离线可用,无需外部服务
  • 轻量级,按需加载
  • 自动索引文章内容
  • 自适应明暗模式

使用方式

点击导航栏右上角 🔍 搜索图标即可打开搜索面板。构建时自动生成索引:

Terminal window
bun run build # 构建站点 + 生成搜索索引

查看搜索功能文档 →


ShokaX 主题持续更新中,更多功能特性敬请期待:

  • 🌙 深色模式切换(已内置,文档待完善)
  • 💬 评论系统集成(规划中)
  • 📊 文章统计与阅读时间(已内置,文档待完善)
  • 🏷️ 标签云展示(已内置,文档待完善)

有功能建议?欢迎在 GitHub Issues 提出!

津 ICP 备2022001375 号
津公网安备 12011402001353 号