🚀快速开始 -->🌈基本配置 -->🏆界面显示 -->🎨特殊功能
# 快速安装
| |
| git clone https://github.com/amehime/hexo-theme-shoka.git ./themes/shoka |
# 安装依赖插件
在使用主题前,需要安装以下插件
| 插件名称 | npm 地址 | 功能 | 依赖程度 |
|---|
| hexo-renderer-multi-markdown-it | 链接 | md 文件渲染器,压缩 css/js/html | 必需 |
| hexo-autoprefixer | 链接 | 给生成的 css 文件们添加浏览器前缀 | 必需 |
| hexo-algoliasearch | 链接 | 站内搜索功能 | 搜索按钮失效 |
| hexo-symbols-count-time | 链接 | 文章或站点字数及阅读时间统计 | 没有统计功能 |
| hexo-feed | 链接 | 生成 Feed 文件 | 无法生成 Feed 文件 |
# multi-markdown-it 安装与配置
# 安装
- 安装前,需要卸载默认的
hexo-renderer-marked ,以及其他的 md 文件渲染器
| npm un hexo-renderer-marked --save |
- 安装插件
| npm i hexo-renderer-multi-markdown-it -D |
# 配置
- 加入
markdown 配置,用于渲染 md 文件,文件位置 <root>/_config.yml
| markdown: |
| render: |
| html: false |
| xhtmlOut: true |
| breaks: true |
| linkify: true |
| typographer: |
| quotes: "“”‘’" |
| plugins: |
| - plugin: |
| name: markdown-it-toc-and-anchor |
| enable: true |
| options: |
| tocClassName: "toc" |
| anchorClassName: "anchor" |
| - plugin: |
| name: markdown-it-multimd-table |
| enable: true |
| options: |
| multiline: true |
| rowspan: true |
| headerless: true |
| - plugin: |
| name: ./markdown-it-furigana |
| enable: true |
| options: |
| fallbackParens: "()" |
| - plugin: |
| name: ./markdown-it-spoiler |
| enable: true |
| options: |
| title: "你知道得太多了" |
- 加入
minify 配置,压缩代码
| minify: |
| html: |
| enable: true |
| exclude: |
| - "**/json.ejs" |
| - "**/atom.ejs" |
| - "**/rss.ejs" |
| css: |
| enable: true |
| exclude: |
| - "**/*.min.css" |
| js: |
| enable: true |
| mangle: |
| toplevel: true |
| output: |
| compress: |
| exclude: |
| - "**/*.min.js" |
- 停用默认的代码高亮功能,否则代码块的 mac 样式不能正常显示
找到 hightlight 和 prismjs ,把 enable 改为 false
| highlight: |
| enable: false |
| |
| prismjs: |
| enable: false |
# autoprefixer 配置
| autoprefixer: |
| exclude: |
| - "*.min.css" |
如果没有这个插件,首页卡片翻转效果无法正常显示
# 应用主题
# 替换默认主题
修改站点配置文件 <root>/_config.yml ,把主题修改为 shoka
# 修改主题配置
shoka 主题默认的参数在 <root>/thems/shoha/_config.yml 中。
为了方便对主题进行配置,在根目录下新建一个 yml 文件,文件名为 _config.shoka.yml