从 01 开始 从 01 开始
首页
  • 📚 计算机基础

    • 计算机简史
    • 数字电路
    • 计算机组成原理
    • 操作系统
    • Linux
    • 计算机网络
    • 数据库
    • 编程工具
    • 装机
  • 🎨 前端

    • Node
  • JavaSE
  • Java 高级
  • JavaEE

    • 构建、依赖管理
    • Ant
    • Maven
    • 日志框架
    • Junit
    • JDBC
    • XML-JSON
  • JavaWeb

    • 服务器软件
    • 环境管理和配置管理-科普篇
    • Servlet
  • Spring

    • Spring基础
  • 主流框架

    • Redis
    • Mybatis
    • Lucene
    • Elasticsearch
    • RabbitMQ
    • MyCat
    • Lombok
  • SpringMVC

    • SpringMVC 基础
  • SpringBoot

    • SpringBoot 基础
  • Windows 使用技巧
  • 手机相关技巧
  • 最全面的输入法教程
  • 最全面的浏览器教程
  • Office
  • 图片类工具
  • 效率类工具
  • 最全面的 RSS 教程
  • 码字工具
  • 各大平台
  • 校招
  • 五险一金
  • 职场规划
  • 关于离职
  • 杂谈
  • 自媒体
  • 📖 读书

    • 读书工具
    • 走进科学
  • 🌍 英语

    • 从零开始学英语
    • 英语兔的相关视频
    • Larry 想做技术大佬的相关视频
  • 🏛️ 政治

    • 反腐
    • GFW
    • 404 内容
    • 审查与自我审查
    • 互联网
    • 战争
    • 读书笔记
  • 💰 经济

    • 关于税
    • 理财
  • 💪 健身

    • 睡眠
    • 皮肤
    • 口腔健康
    • 学会呼吸
    • 健身日志
  • 🏠 其他

    • 驾驶技能
    • 租房与买房
    • 厨艺
  • 电影

    • 电影推荐
  • 电视剧
  • 漫画

    • 漫画软件
    • 漫画推荐
  • 游戏

    • Steam
    • 三国杀
    • 求生之路
  • 小说
  • 关于本站
  • 关于博主
  • 打赏
  • 网站动态
  • 友人帐
  • 从零开始搭建博客
  • 搭建邮件服务器
  • 本站分享
  • 🌈 生活

    • 2022
    • 2023
    • 2024
    • 2025
  • 📇 文章索引

    • 文章分类
    • 文章归档

晓林

程序猿,自由职业者,博主,英语爱好者,健身达人
首页
  • 📚 计算机基础

    • 计算机简史
    • 数字电路
    • 计算机组成原理
    • 操作系统
    • Linux
    • 计算机网络
    • 数据库
    • 编程工具
    • 装机
  • 🎨 前端

    • Node
  • JavaSE
  • Java 高级
  • JavaEE

    • 构建、依赖管理
    • Ant
    • Maven
    • 日志框架
    • Junit
    • JDBC
    • XML-JSON
  • JavaWeb

    • 服务器软件
    • 环境管理和配置管理-科普篇
    • Servlet
  • Spring

    • Spring基础
  • 主流框架

    • Redis
    • Mybatis
    • Lucene
    • Elasticsearch
    • RabbitMQ
    • MyCat
    • Lombok
  • SpringMVC

    • SpringMVC 基础
  • SpringBoot

    • SpringBoot 基础
  • Windows 使用技巧
  • 手机相关技巧
  • 最全面的输入法教程
  • 最全面的浏览器教程
  • Office
  • 图片类工具
  • 效率类工具
  • 最全面的 RSS 教程
  • 码字工具
  • 各大平台
  • 校招
  • 五险一金
  • 职场规划
  • 关于离职
  • 杂谈
  • 自媒体
  • 📖 读书

    • 读书工具
    • 走进科学
  • 🌍 英语

    • 从零开始学英语
    • 英语兔的相关视频
    • Larry 想做技术大佬的相关视频
  • 🏛️ 政治

    • 反腐
    • GFW
    • 404 内容
    • 审查与自我审查
    • 互联网
    • 战争
    • 读书笔记
  • 💰 经济

    • 关于税
    • 理财
  • 💪 健身

    • 睡眠
    • 皮肤
    • 口腔健康
    • 学会呼吸
    • 健身日志
  • 🏠 其他

    • 驾驶技能
    • 租房与买房
    • 厨艺
  • 电影

    • 电影推荐
  • 电视剧
  • 漫画

    • 漫画软件
    • 漫画推荐
  • 游戏

    • Steam
    • 三国杀
    • 求生之路
  • 小说
  • 关于本站
  • 关于博主
  • 打赏
  • 网站动态
  • 友人帐
  • 从零开始搭建博客
  • 搭建邮件服务器
  • 本站分享
  • 🌈 生活

    • 2022
    • 2023
    • 2024
    • 2025
  • 📇 文章索引

    • 文章分类
    • 文章归档
  • 从零开始搭建博客系列
  • 什么是博客
  • VuePress
  • VuePress 日常使用
  • 主题
  • 插件
  • 更多配置
  • 部署
  • 域名、HTTPS 和备案
  • 图床
  • 搜索功能
  • Meilisearch 自建实践
  • 评论区
  • Twikoo 配置表情包
    • 默认表情包
    • 自定义表情包
    • 其他
    • 想抄作业?
    • 感谢
    • 参考
  • CDN
  • 数据统计
  • SEO
  • 友情链接
  • 网站安全

  • SSL 证书续费
  • 配置 RSS 订阅
  • 显示数学公式块
  • 添加 mermaid 支持
  • 关于邮件服务器
  • 我的写作流
  • 增加浏览器控制台输出
  • 从零开始搭建博客系列-终
  • 搭建博客
2024-07-06
目录

Twikoo 配置表情包

# 18.Twikoo配置表情包

偶然看到其他博客的评论区配置了丰富的表情包,于是自己也折腾了下~

‍

# 默认表情包

Twikoo 默认只支持这三种表情包:

​​

打开配置,可以看到“表情CDN”的配置,默认是 https://owo.imaegoo.com/owo.json:

​​ ‍

打开这个 JSON 文件,可以看到内容是每个表情包的图片地址,以及文本(共有 3 组):

​​ ‍

# 自定义表情包

我们可以自定义表情包,所有表情配置为一个 JSON 文件,分好组即可。

首先,我们可以自己做一组表情包,但这很费时费力。

为此,我们可以引用其他人做好的表情包,例如:github.com/2X-ercha/Twikoo-Magic (opens new window),这个项目有很多种表情包,并且提供了对应的 JSON 文件。

​​ ‍

PS:在该项目的 image 文件夹,可以看到所有图片。网络不好的同学可以下载该项目后逐个观看。

我们可以选择需要的表情包,下载对应的 JSON 文件,然后整合为一个,上传到自己的 CDN 上,再去 Twikoo 配置表情 CDN 即可。本博客评论区效果:

​​

点击表情后,先会在评论区里显示该表情的文本,等发表后才会变成图片:

​​ ‍

注意:

  • 配置完后建议检查下 JSON 的格式是否正确
  • 可以适当压缩 JSON 文件,减小文件大小,加快访问速度
  • 推荐网站:在线 JSON 格式化验证工具 (opens new window),可以检查和压缩 JSON

如果你还不知道什么是 JSON,可以看看我的这篇博客:JSON (opens new window)

# 其他

默认情况下,这个地方显示的是每套表情包的文字:

​​

如果想将其改为图片?也是可以的。先看看原版:

"Sticker": {
        "type": "image",
        "container": [
....
1
2
3
4

‍ 然后修改为:

"<img src=\"https://expression.qjqq.cn/1/650c3f7635526.webp\" style=\"width: 30px;top: 4px;position: relative;\" title=\"bochi\">": {
    "type": "image",
    "container": [
.....
1
2
3
4

‍ 效果:底部的文本变成了图片

​​

搞定,收工!欢迎使用表情包!

# 想抄作业?

可以直接保存我的 JSON 文件:https://www.peterjxl.com/peterjxl.com-Twikoo-Sticker.json (opens new window),放到自己的 CDN 上即可~

# 感谢

感谢丝缇 (opens new window)制作的波奇表情包!

# 参考

  • Twikoo 添加自定义表情包 | Mo的记事簿 (opens new window)
  • Twikoo表情合集(一) | 青桔气球 (opens new window)
  • 批量替换旧的Twikoo表情包地址,修复旧的jsdelivr链接 | 张洪Heo (opens new window)
  • github.com/2X-ercha/Twikoo-Magic (opens new window)
  • 自制‘贴纸波奇’表情包! - 丝提的小站 (opens new window) ‍
上次更新: 2025/6/3 09:31:54
评论区
CDN

← 评论区 CDN→

最近更新
01
学点统计学:轻松识破一本正经的胡说八道
06-05
02
2025 年 5 月记
05-31
03
《贫穷的本质》很棒,但可能不适合你
05-27
更多文章>
Theme by Vdoing | Copyright © 2022-2025 | 粤 ICP 备 2022067627 号 -1 | 粤公网安备 44011302003646 号 | 点击查看十年之约
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式