前言

以下是小站建设过程中用到的一些常用插件

图片路径转asset_img

将 markdown 图像路径转换为 asset_img 语法，使图像在 typora 和 hexo 中都显示。

在blog目录下的命令指示符中执行：

1
npm install hexo-image-link --save

在blog目录下的_config.yml文件中修改以下内容：

1
post_asset_folder: true

Hexo的Git推送插件

1
npm install hexo-deployer-git --save

在blog目录下的_config.yml文件中修改并加入内容：

1
2
3
4
deploy:
  type: 'git'
  repository: #仓库地址
  branch: main #一般为main、master

永久链接

在blog目录下的命令指示符中执行：

1
npm install hexo-abbrlink --save

在blog目录下的_config.yml文件中修改并加入内容：

1
2
3
4
5
6
7
8
9
10
#修改内容
permalink: posts/:abbrlink/
permalink_defaults:
#加入内容
abbrlink:
  alg: crc32      # 使用 CRC32 算法（生成 8 字符长链）
  rep: hex        # 链接格式为十六进制（如 "abc123"）
  drafts: false   # 不为草稿生成短链
  force: false    # 不强制重新生成已有短链的文章
  writeback: true # 将短链写入文章的 Front Matter

其中得到posts可自定义替换

文章加密

在blog目录下的命令指示符中执行：

1
npm install --save hexo-blog-encrypt

在要加密的文章页面的Front-matter部分加入以下内容：

1
2
3
4
5
6
password: xxxxxx
abstract: 有东西被加密了, 请输入密码查看.
message: 您好, 这里需要密码.
theme: Shrink
wrong_pass_message: 抱歉, 这个密码看着不太对, 请再试试.
wrong_hash_message: 抱歉, 这个文章不能被校验, 不过您还是能看看解密后的内容.

在blog目录下的_config.yml文件中添加以下内容：

1
2
3
4
5
6
7
8
#文章加密
encrypt: # hexo-blog-encrypt
  abstract: 有东西被加密了, 请输入密码查看.
  message: 您好, 这里需要密码.
  tags:
  - {name: 总结, password: xxxxxx}
  wrong_pass_message: 抱歉, 这个密码看着不太对, 请再试试.
  wrong_hash_message: 抱歉, 这个文章不能被校验, 不过您还是能看看解密后的内容.

password: 自定义设置的密码值

theme: Shrink 加密文件显示的主题

abstract: 用于设置加密文章显示的摘要。

message: 输入密码提示。

wrong_pass_message: 输入错误提示。

wrong_hash_message: 校验错误提示。

轮播图置顶文章

在blog目录下的命令指示符中执行：

1
npm install hexo-butterfly-swiper --save

在blog目录下的_config.yml文件中修改并加入内容：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
# 轮播文章置顶
# see https://akilar.top/posts/8e1264d1/
swiper:
  enable: true # 开关
  priority: 5 #过滤器优先权
  enable_page: all # 应用页面
  timemode: date #date/updated
  layout: # 挂载容器类型
    type: id
    name: recent-posts
    index: 0
  default_descr: 点击查看置顶文章啦~~~
  swiper_css: https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper.min.css #swiper css依赖
  swiper_js: https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper.min.js #swiper js依赖
  custom_css: https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiperstyle.css # 适配主题样式补丁
  custom_js: https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper_init.js # swiper初始化方法

在要轮播的文章页面的Front-matter部分加入以下内容：

1
swiper_index: 1 #置顶轮播图顺序，非负整数，数字越大越靠前

文章置顶和隐藏

在blog目录下的命令指示符中执行：

1
npm install hexo-generator-index --save

在文章页面的Front-matter部分添加 sticky 或 top 参数（sticky 的优先级比 top 高），可以置顶文章，添加hide参数隐藏文章。

1
2
3
4
5
#置顶方式有两种sticky或top，数字越大优先级越考前
sticky: 数字
top: 数字
#隐藏
hide: true

字数统计

在blog目录下的命令指示符中执行：

1
npm install hexo-wordcount --save

在blog目录下的_config.butterfly.yml文件中开启字数统计。

1
2
wordcount:
  enable: true

本地搜索

在blog目录下的命令指示符中执行：

1
npm install hexo-generator-search --save

在blog目录下的_config.yml文件中修改并加入内容：

1
2
3
4
5
6
#本地搜索
search:
  path: search.json
  field: post
  content: true
  format: striptags
  • path - 生成的数据库文件的路径。支持和格式。如果未提供文件扩展名，则默认使用 JSON 格式
  • field - 要搜索的搜索范围，您可以选择：
    • post （默认） - 将仅涵盖您博客的所有文章。
    • page - 将仅覆盖您博客的所有页面。
    • all - 将覆盖您博客的所有帖子和页面。
  • content - 是否包含每篇文章的全部内容。如果 ，生成的结果仅涵盖标题和其他元信息，而不涵盖主体
  • format - 页面内容的形式，选项有：
    • striptags （默认）缩小原始 html 字符串，并删除所有标签。
    • html - 正在缩小的原始 html 字符串。
    • raw - 每个帖子或页面的 Markdown 文本。

在blog目录下的_config.butterfly.yml文件中开启本地搜索。

1
2
3
4
5
6
7
8
9
10
#搜索
search:
  use: local_search
  placeholder: 搜索文章

  local_search:
    preload: false
    top_n_per_article: -1
    unescape: false
    CDN:

添加RSS

在blog目录下的命令指示符中执行：

1
npm install hexo-generator-feed --save

在blog目录下的_config.yml文件中修改并加入内容：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
# RSS
feed:
    enable: true
    type: rss2
    path: rss2.xml
    limit: 20
    hub:
    content: 
    content_limit: 300
    content_limit_delim: ' '
    order_by: -date 
    icon: icon.png
    autodiscovery: true 
    template:

  • type - atom和rss2两种类型

  • path - 源路径。当同时指定了这两种类型时。（默认值：atom.xml/rss2.xml）

  • limit - 源中的最大帖子数（使用 or 显示所有帖子）0 false

  • hub - PubSubHubbub 中心的 URL（如果不使用它，请将其留空）

  • content -（可选）设置为 ‘true’ 以在源中包含整个文章的内容。

  • content_limit -（可选）摘要中使用的文章内容的默认长度。仅当内容设置为 false 且不存在自定义文章描述时才使用。

  • content_limit_delim -（可选）如果使用 content_limit 来缩短帖子内容，则仅在达到字符限制之前最后一次出现此分隔符时进行剪切。默认情况下不使用。

  • order_by - Feed 排序依据。（默认值：-date）

  • 图标 -（可选）自定义源图标。默认为主配置中指定的 email 的 gravatar。

  • autodiscovery - 自动发现添加源。默认为true

  • template - 自定义模板路径。此文件将用于生成源 xml 文件，可以只指定一个自定义模板，即使此插件配置为输出两种 Feed 类型。

在blog目录下的_config.butterfly.yml文件中添加rss路径。

1
rss: /rss2.xml
博客搭建系列文章
  1. Hexo-Butterfly美化教程-[1]基础环境
  2. Hexo-Butterfly美化教程-[2]Butterfly主题安装
  3. Hexo-Butterfly美化教程-[3]建主要页面
  4. Hexo-Butterfly美化教程-[4]修改配置文件
  5. Hexo-Butterfly美化教程-[5]安装常用插件
  6. Hexo-Butterfly美化教程-[6]开启博客评论
  7. Hexo-Butterfly美化教程-[7]功能魔改(源码方式)
  8. Hexo-Butterfly美化教程-[8]随鼠标变幻的动态粒子线条背景
  9. Hexo-Butterfly美化教程-[9]繁沙
  10. 在Github上使用OsmosFeed搭建在线RSS阅读器（无需服务器）