本文使用 shoka 主题

# 安装 shoka 主题

克隆 shoka 主题到本地

cd <your_blog>
# git clone https://github.com/amehime/hexo-theme-shoka.git ./themes/shoka 作者提供的 github 源,需要网络较好
git clone https://gitee.com/zkz0/hexo-theme-shoka.git ./themes/shoka #gitee 镜像源

将文件夹改名为 shoka , 打开根目录 _config.yml
更改为如下内容:

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: shoka

# 安装 shoka 的 md 渲染插件

安装 shoka 主题的 md 渲染器插件:

# cd <your_blog>
yarn remove hexo-renderer-marked
# cnpm i hexo-renderer-multi-markdown-it
yarn add hexo-renderer-multi-next-markdown-it #博主制作的全新版本渲染器,建议安装

如果报错替换为下列指令:

如果安装 hexo-renderer-multi-next-markdown-it 则不会存在此问题

cnpm i hexo-renderer-multi-markdown-it --ignore-scripts
cnpm un puppeteer
cnpm i puppeteer
cnpm i bufferutil
cnpm i utf-8-validate

# 安装 shoka 的插件

执行如下命令:

yarn add hexo-autoprefixer
yarn add hexo-algoliasearch
yarn add hexo-symbols-count-time
yarn add hexo-feed

# 配置 shoka 主题

# 配置 hexo-renderer-multi-markdown-it

在根目录下 _config.yml 加入 md 配置和 minify 配置:

markdown:
  render: # 渲染器设置
    html: false # 过滤 HTML 标签
    xhtmlOut: true # 使用 '/' 来闭合单标签 (比如 <br />)。
    breaks: true # 转换段落里的 '\n' 到 <br>。
    linkify: true # 将类似 URL 的文本自动转换为链接。
    typographer: 
    quotes: '“”‘’'
  plugins: # markdown-it 插件设置
    - plugin:
        name: markdown-it-toc-and-anchor
        enable: true
        options: # 文章目录以及锚点应用的 class 名称,shoka 主题必须设置成这样
          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:
  html:
    enable: true
    exclude: # 排除 hexo-feed 用到的模板文件
      - '**/json.ejs'
      - '**/atom.ejs'
      - '**/rss.ejs'
  css:
    enable: true
    exclude:
      - '**/*.min.css'
  js:
    enable: true
    mangle:
      toplevel: true
    output:
    compress:
    exclude:
      - '**/*.min.js'

随后关闭 hexo 自带代码高亮:

highlight:
  enable: false
prismjs:
  enable: false

# 配置其他功能

根目录 yaml 加入如下配置:

autoprefixer:
  exclude:
    - '*.min.css'
keywords: #站点关键词,用 “,” 分隔
feed:
  limit: 20
  order_by: "-date"
  tag_dir: false
  category_dir: false
  rss:
    enable: true
    template: "themes/shoka/layout/_alternate/rss.ejs"
    output: "rss.xml"
  atom:
    enable: true
    template: "themes/shoka/layout/_alternate/atom.ejs"
    output: "atom.xml"
  jsonFeed:
    enable: true
    template: "themes/shoka/layout/_alternate/json.ejs"
    output: "feed.json"

# 配置搜索功能

在根目录 _config.yml 加入如下配置:

algolia:
  appId: #Your appId
  apiKey: #Your apiKey
  adminApiKey: #Your adminApiKey
  chunkSize: 5000
  indexName: #"shoka"
  fields:
    - title #必须配置
    - path #必须配置
    - categories #推荐配置
    - content:strip:truncate,0,2000
    - gallery
    - photos
    - tags

获取 APPID 步骤:
进入 algolia , 点击右上角的 start free , 根据提示填入信息即可
数据库位置可自行选择,随后创建应用,点击左下角齿轮,选择 api keys
然后将 apikeys 填入对应选项:

appId 对应 Application ID
apiKey 对应 Search-Only API Key
adminApiKey 对应 Admin API Key
indexName 填入你的项目 index 名

shoka 主题剩余配置可自行查看文档
如遇到问题可以在评论区提问

# 配置 hexo

打开根目录 _config.yml

仅关注站点配置部分,部署及增强日后再聊

Site 部分:

# Site
title: #你的站点名 (中标题,大标题是主题的 alternate 选项)
subtitle: #副标题 (小标题)
description: #站点描述,不建议小于 15 字
keywords: #关键字,用半角逗号分隔
author: #作者名
language: zh-CN #中文为 zh-CN
timezone: 'Asia/Shanghai' #东八区时区

url 部分:

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://www.kaitaku.xyz #你的 url, 需要协议头
# permalink: :year/:month/:day/:title/
permalink: :title/ #推荐这样,有利于 SEO
permalink_defaults:
pretty_urls:
  trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
  trailing_html: true # Set to false to remove trailing '.html' from permalinks

推荐安装 hexo-filter-nofollow 优化 SEO:

cnpm i hexo-filter-nofollow

在根目录 config.yml 添加如下内容:

nofollow:
  enable: true # 是否启用
  field: site #site 全站,post 仅文章
  exclude:
    - 'www.kaitaku.xyz' #例外网站
此文章已被阅读次数: 正在加载... 更新于

请我喝[茶]~( ̄▽ ̄)~*

chou kaitaku 微信支付

微信支付

chou kaitaku 支付宝

支付宝