摘要生成中...
AI 摘要
Hunyuan-lite
这是一篇索引文章

Waline 的基础定制无非涉及以下几个地方:

  1. 修改环境变量达到自定义效果。
  2. 服务端配置自定义的逻辑选项。Vercel 托管着 GitHub 仓库,通过在 index.js 使用服务端 API 即可实现复杂逻辑。
  3. 客户端配置选项。根据自身的主题,在客户端中自定义 Waline 前端选项。
  4. 修改 waline.jswaline.css 文件
本文评论区可以测试,不过请尽量发有意义的内容。不要单纯评论 123test 等。

Waline 的基础定制

Waline 邮件通知

站内文章Waline 邮件通知以及个性化邮件的设置 ,文章介绍为网站建设邮件服务以及设置信纸的操作步骤。

image.png

头像服务配置

Waline 默认的头像服务加载速度还是不够快,且对于大多数用户没有进行正确的头像匹配。

image.png

站内文章Waline 配置头像服务(含常用公共头像服务介绍) ,这篇文章包含「修改 Waline 默认头像」、「通过 QQ 邮箱自动获取头像」的方法。

客户端自定义

image.png

站内文章学会通过看文档配置 Butterfly 主题中的 Waline 客户端 介绍 Butterfly 主题下配置显示文字、表情选项卡定制等客户端配置内容。

站内文章自定义 Waline 客户端——修改 CSS 介绍通过修改 CSS 的方式实现定制化。效果图:

image.png

image.png

评论安全

站内文章Waline 评论安全 介绍最大限度减少垃圾评论的措施,包括 IP 黑名单、关键词屏蔽以及发言频率限制等。

评论区外链中间页跳转

中间页主要是为了规避外链风险。一般 Hexo 渲染插件无法对 Waline 评论系统进行处理,我们可以通过安装 Waline 插件完成中间页替换的功能。

具体做法详见这篇文章:站内文章Hexo 博客与 Waline 评论区实现外链跳转中间页

image.png

Waline 加速

这篇文章 站内文章Waline 评论系统加速 汇总了一些常见的加速手段,包含了一些上述文章中的相关内容。

Waline 高级定制

页面统计量

强烈建议开启 Waline 自带的 页面浏览量统计 功能!原因:

  1. 为网站统计服务提供备选方案。有时候你可能选择更换统计服务,又或者是改了域名,你的访问数据可能会被清空,而迁移又十分麻烦!
  2. 评论数据和统计数据绑在一起,更方便维护。

如果之前使用了不蒜子(Busuanzi)进行了页面浏览量统计,可以考虑将页面统计量迁移到 Waline 中,详见这篇文章:站内文章将不蒜子中的数据迁移到 Waline

自建 Auth 认证

站内文章Waline 自建 Auth 认证 介绍 Waline 自建认证服务的方法,它可以自定义接入的第三方服务。

客户端属性 path 的配置方法

此部分内容需要修改 Butterfly 主题源代码

Waline 的评论数据是靠当前网页路径分辨的。假设在你的网站中,/p/article//p/article/p/article.html 都指向同一个页面,但在默认的情况下,Waline 会将不同路径的数据分开存储。解决的方法是修改客户端属性 path

在 Butterfly 主题源码 layout/includes/third-party/comments/waline.pug 路径下,做以下修改:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
const initWaline = (Fn, el = document, path = window.location.pathname) => {

// 处理路径的逻辑,参考 https://waline.js.org/reference/client/props.html#path
+ let processedPath = path
+ .replace(/\/index\.html$/, '/') // 移除 index.html
+ .replace(/\.html$/, '') // 移除其他 .html 后缀
+ .replace(/([^\/])$/, '$1/'); // 结尾无斜杠则自动加斜杠

const waline = Fn({
el: el.querySelector('#waline-wrap'),
serverURL: '!{serverURL}',
pageview: !{lazyload ? false : pageview},
dark: 'html[data-theme="dark"]',
comment: !{lazyload ? false : count},
...option,
- path: isShuoshuo ? path : (option && option.path) || path
+ path: isShuoshuo ? path : (option && option.path) || processedPath
})

参考:

Waline 数据库迁移

LeanCloud 迁移至 MySQL 方法详见:站内文章Waline 数据库迁移