关于Butterfly主题的配置,官方文档中有已经有了非常详细的描述。
包括评论插件等、这些看起来很高端的功能,都只需要进行简单的配置
这里我们主要做一些微小的补充。
本文关于Butterfly主题的配置,主要基于版本"2.2.5",与最新版本的Butterfly存在部分区别。
_config.yml的区分
在主题安装完成后,我们会看到两个_config.yml
,其中在Hexo根目录下的_config.yml
用以配置Hexo的配置。在Butterfly下的_config.yml
用以配置主题相关的_config.yml
。在Butterfly的文档中,除非有特别说明,否则一般都是指Butterfly下的_config.yml
。
fontawesome_v5的注意
如这个博客所示,我们在菜单栏中会看到很多图标,实际上这些图标并不是一张一张的图片,而是所谓的fontawesome,图标字体库。该图标字体库有好几个版本,Butterfly中默认使用V4版本,目前最新的是V5版本(在2022年,最新版本的已经是V6了)。和V4版本相比,V5版本的图标数量更多。
关于如何从V4升级到V5,参考Butterfly的文档。
我们主要讲一下需要注意的地方。在V4版本的fontawesome,格式都是类似这个fa fa-github
。但是在V5版本的fontawesome,格式改为了fab fa-github
和fas fa-home
等,其中fab开头的表示brand,品牌。fas开头的继续写作fa也可以。
关于V4和V5的区别,在fontawesome官网中有明确描述。但是在通过百度搜索出来的,所谓的fontawesome中国站等假的官网中,并没有进行说明。
font_link的注意
在Butterfly的配置文件中有默认配置如下:
1 | font_link: https://fonts.googleapis.com/css?family=Titillium+Web |
这是一个字体的链接,访问的是谷歌的地址。一般网上会有建议换成中科大的地址,如下:
1 | font_link: https://fonts.lug.ustc.edu.cn/css?family=Titillium+Web |
但是!实际上!国内请求fonts.googleapis.com
,早就是访问北京的机器了。大家ping一下,搜一下IP地址即可发现。而且根据站长之家测速工具,fonts.lug.ustc.edu.cn
已经不可用了。
版权邮箱的配置
每一篇文章的底部,我们都可以配置版权信息。在版权信息中有一个文章作者,点击后应该是调用邮箱发邮件。
该处邮箱的配置,在文档中没有说明,但是在答疑群里,管理员很快的解答我的疑惑了。
修改Hexo的_config.yml
,添加一行email:
。
Valine评论系统的邮件提醒
Butterfly主题提供了多种评论系统,且都只需要进行简单的配置。其中Gitment、Gitalk都是用的GitHub issue。
这里,我们介绍Valine评论系统的邮件系统,能够轻松地发送邮件提醒,而且该款还可以在邮件提醒的时候提供链接,链接直达文章。
在Valine官方文档,有描述
!!! 自带的邮件提醒功能将在v1.4.0发布时下线,请使用自带邮件提醒的用户注意更改为第三方邮件提醒
https://valine.js.org/notify.html
同时valine官方推荐的第三方邮件提醒是 Valine-Admin
Valine-Admin的配置
登录Leancloud,依次点击云引擎
- 设置
在代码库
中填入Valine-Admin的Git地址。
然后在下方配置自定义环境变量
加粗为必填项目。
变量名 | 介绍 | 例如 |
---|---|---|
SITE_NAME | 博客的名称 | kakawanyifan.com |
SITE_URL | 博客的地址 | https://kakawanyifan.com |
SMTP_USER | 发件人用户名,一般即发件人邮箱。 | ***@***.com |
SMTP_PASS | 发件人密码 | ****** |
SENDER_NAME | 发件人名称 | KakaWanYifan-博客评论提醒 |
SMTP_SERVICE | 邮件服务商 | |
SENDER_EMAIL | 发件人邮箱 | ***@***.com |
ADMIN_URL | 带www 的博客地址SENDER_EMAIL |
www.kakawanyifan.com |
BLOGGER_EMAIL | 博主的邮箱地址,默认值为 | i@m.kakawanyifan.com |
MAIL_SUBJECT | 评论回复邮件标题 | 见下文 |
MAIL_TEMPLATE | 评论回复邮件模板 | 见下文 |
MAIL_SUBJECT_ADMIN | 新评论邮件标题 | 见下文 |
MAIL_TEMPLATE_ADMIN | 新评论邮件模板 | 见下文 |
邮件模板和标题由一些参数拼接而成。
- 所有的参数需要用${变量名}包裹起来。
- 斜体部分表示只能在评论回复邮件中用。
可以用到的参数有
参数 | 说明 |
---|---|
SITE_NAME | 博客名称 |
SITE_URL | 博客首页地址 |
POST_URL | 文章地址(完整路径) |
PARENT_NICK | 收件人昵称(被@者,父级评论人) |
PARENT_COMMENT | 父级评论内容 |
NICK | 新评论者昵称 |
COMMENT | 新评论内容 |
例如这两个:
1 | MAIL_TEMPLATE |
1 | MAIL_TEMPLATE_ADMIN |
特别注意,一般建议SITE_URL不要带有/
,即建议写作https://kakawanyifan.com
,而不是https://kakawanyifan.com/
,否则效果会像这样
注意有两个//
,虽然并不影响访问。
Valine-Admin的部署
依次点击云引擎
- 部署
。选择Git源码部署
,生产环境
,master分支
,Do not use cache
需要勾选上。然后点击部署即可。
Valine-Admin的定时任务
受限于免费的LeanCloud有休眠正常,我们通过配置定时任务来弥补。
新建定时任务,配置分别为
-
自动唤醒
- 名称:自动唤醒
- 生产环境:self-wake
- cron表达式:0 0/30 7-23 * * ?
-
补发邮件
- 名称:定时检查24小时内漏发的邮件通知
- 生产环境:resend-mails
- cron表达式:0 0 8 * * ?
BUG发现
如下图所示,每一篇文章都有一个阅读量。但是我们也发现,同一篇文章,在不同的浏览器上,阅读量居然不一样。
Butterfly
的阅读量计算,其实是调用的busuanzi
的。
在答疑群中,我发现,不只有我遇到了这个问题,其他人也有。
- 或者是我们都配置错了
- 或者是
Butterfly
错了 - 或者是
busuanzi
错了
在BUG没有得到修复之前,我暂时把该功能移除了。
在Butterfly
中,可以选择对busuanzi
部分功能开启或关闭。
1 | busuanzi: |
site_uv
是指博客的用户量site_pv
是指博客的访问量page_pv
是指文章的阅读量,也是出现BUG的地方。