五.功能配置

1.评论功能配置(Twikoo)

(a)申请免费 MongoDB Atlas  账号(账号.note)，500M空间，获取到数据库链接地址。

1
mongodb+srv://userName:password@cluster0.y4oey.mongodb.net/?retryWrites=true&w=majority&appName=Cluster0

(b)部署到 netlify (github登录)

参考：https://twikoo.js.org/backend.html#netlify-部署

©butterfly 主题文件配置

参考： https://butterfly.js.org/posts/ceeb73f/#評論

1
2
3
4
5
6
7
8
9
10
11
comments:
  # 使用的评论（最多支持两个，不需要请留空）。
  use: Twikoo # Valine,Disqus
  text: true # 是否显示评论服务商的名字
  lazyload: false
  count: false # 是否在文章顶部显示评论数
  card_post_count: false # 是否在首页文章卡片显示评论数

twikoo:
  envId: https://ttddp.netlify.app/.netlify/functions/twikoo
  option:

2.字体配置

字体内容位置：hexo\source\assets\css\font.css、custom.css。

font.css 定义的字体，不管用没有用到，都会加载。建议不用的字体注释。

3.显示访客信息

https://blog.qjqq.cn/posts/36fa.html

4.友情链接配置

参考：https://butterfly.js.org/posts/4aa8abbe/#flink

Hexo 博客的根目录输入：

1
hexo new page link

你会找到 source/link/index.md 这个文件
修改这个文件文档属性：

type: link # 正确
type: - link # 错误，当作普通页面加载，不会读取yml文件。

1
2
3
title: 友情链接
date: 2018-06-07 22:17:49
type: "link"

三种添加方式(远程>本地>页面)：

(a)本地(yml)：

创建文建：source/_data/link.yml

class_name 和 class_desc 支持 html 格式书写，如不需要，也可以留空。

1
2
3
4
5
6
7
- class_name: '<i class="fas fa-check-double" style="color: #FF6666;padding-right: 0.4rem"></i>網站'
  class_desc: '<span style="font-style: italic;">重要的事情説一遍</span>'
  link_list:
    - name: MYW
      link: https://crazywong.com/
      avatar: https://crazywong.com/img/avatar.png
      descr: 今日事,今日畢

(b)远程(json)：

文档属性添加(如同源问题，没加载，显示本地)：

flink_url: https://ttddp.com/link.json

©页面内容:

显示文件内容 source/link/index.md

5.配置自定义侧边栏

https://butterfly.js.org/posts/ea33ab97/

6.配置文档属性说明

页面：

https://butterfly.js.org/posts/dc584b87/#Page-Front-matter

1
2
3
4
5
6
7
8
9
---
title: {{title}}
date: {{date}}
aside: false     #是否显示边栏
description:
top_img:         #顶部图片URL
comments: false
abbrlink:
---

文章：

https://butterfly.js.org/posts/dc584b87/#Post-Front-matter

1
2
3
4
5
6
7
8
9
10
11
12
---
title: {{title}}  #文件名作为标题
date: {{date}}    #当前日期，{{time}} 当前时间
tags:             #定义标签(可多个)
categories:       #分类(单个)
keywords:         #关键字(可选，用于seo)
description:      #描述(设置空，系统自动提取文章内容，设置则在主页显示值)
top_img:          #文章顶部背景图片
cover:            #在主页显示的文章缩略图，
comments: true   #是否显示评论
abbrlink:        #自动生成链接串号，系统自动设置值。
---

7.文章封面设置

参考：https://butterfly.js.org/posts/4aa8abbe/#文章封面

8.CDN配置

参考：https://butterfly.zhheo.com/page.html

自定义CDN:
https://github.com/jerryc127/hexo-theme-butterfly/blob/d8a1fa6417e261c0ceccdb03aba07a8101253f0f/_config.yml

推荐cdn: https://cdn.bytedance.com/
CDN介绍：https://blog.anheyu.com/posts/fe76.html

9.系列文章配置

参考：https://butterfly.js.org/posts/4aa8abbe/#series-系列文章
_config.yml配置：

1
2
3
4
5
series:
   enable: true
   orderBy: 'date' # Order by title or date
   order: 1 # Sort of order. 1, asc for ascending; -1, desc for descending
   number: false # false-不自动编号

所有同一系列(hexo配置)文章front-matter设置文档属性名：series，设置为hexo配置；同系列文章的侧边栏会出现“系列文章”卡片。

1
2
3
4
5
---
title: (三)配置Hexo博客功能
date: 2024-09-21 22:27
series: hexo配置
---

image.png

文章内容中可添加(可选)：
{% series %}
image.png

10.开启美化配置

_config.butterfly.yml 配置

1
2
3
4
5
6
7
8
9
10
11
12
# Beautify (美化頁面顯示,会改变ol、ul、h1-h5的样式。)
(assets/css/custom.css 文件重新设置了hr 等元素的样式，所以需在cdn配置中加载本机 assets/fonts/fontawesome-pro-6.css 文件)

beautify:
  enable: true
  field: post # site/post 全站/文章页生效
  title-prefix-icon:  '\f0c1'
  title-prefix-icon-color: '#F47466'

CDN:
  option:
    fontawesome: /assets/fonts/fontawesome-pro-6.css

11.文章简洁模式增加系列卡片

指定文章的文档属性(其它属性设置略)：

1
2
3
---
toc_style_simple: true
---

butterfly主题widget插件文件:
\hexo\themes\butterfly\layout\includes\widget\index.pug
image.png
效果:
image.png

12.Front-matter配置

post 文章:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
---
title: 【必选】页面显示的标题。
date: 【必选】日期。
abbrlink: 【自动】文章链接地址，自动生成不用设置。
updated: 【可选】更新日期
keywords: 【可选】关键字集(文本)，以逗号分隔，如 “hexo,博客”
description: 【可选】文章摘要(文本)
tags: 【可选】标签集(列表文本)，-加空格加标签名，如“- hexo”
categories: 【可选】分类名(文本)，如“Hexo”
aside: 【可选】是否显示侧边栏(默认true/false)
comments: 【可选】是否显示评论(默认true/false).
series: 【可选】文章系列名(文本)，相同名称组合在一起。
toc: 【可选】是否显示侧边栏的目录卡片(默认true/false)
toc_number: 【可选】是否显示目录号(l默认false/true)
toc_style_simple: 【可选】是否显示简洁模式(默认false/true)
cover: 【可选】文章缩略图(默认留空/false/图片地址)
sticky: 【可选】置顶权重(数字。默认空，不置顶)。如“100”
password: 【可选】文章加密(文本。默认空，不加密)
---

从sitmap中排除指定文章：
sitemap: false