Moetwemoji:轻量级动画表情符号 (AVIF) - 让您的论坛充满活力

PixPin_2026-01-04_22-04-17

大家好!:waving_hand:

我创建了一个新的插件,旨在为 Discourse 社区带来更多活力和动态表情。Moetwemoji 引入了一组动画表情符号,使互动更加生动有趣。

:rocket: 主要特点

  • 超轻量级: 所有表情符号均以 AVIF 格式编码。

  • 高性能: 平均文件大小仅约 10KB,确保您的论坛加载速度快,同时外观精美。

  • 灵活部署: 我根据您的需求提供了两个不同的版本(覆盖或补充)。


:package: 选择您的版本

我准备了两个独立的存储库,具体取决于您希望如何将这些表情符号集成到您的论坛中。

选项 1:覆盖版本(完全替换)

如果您想用这些动画表情符号完全替换默认的静态 Twemoji 集合,请使用此版本。它会覆盖系统默认设置,使动画成为标准体验。

选项 2:包版本(补充)

如果您更喜欢保留标准表情符号,并仅将这些添加为一个额外的“包”到表情符号选择器中,请使用此版本。它会在您的表情符号选择器中添加一个新标签页,而不会更改默认设置。


16 个赞

感谢分享 :+1:

我试着测试了一下,但即使在 app.yaml 文件中添加了仓库,它仍然不起作用。

需要设置什么参数吗?

谢谢。

好的,请尝试手动安装

手动安装指南(覆盖版本)

本指南说明如何在正在运行的 Discourse 容器内手动安装和应用 discourse-moetwemoji-twemoji-fakepng-override 插件,并阐明为什么不严格要求进行完全重建即可使用覆盖版本。


1. 进入 Discourse 容器

在您的服务器上,进入 Discourse Docker 目录(通常是 /var/discourse)并进入正在运行的容器:

cd /var/discourse
./launcher enter app

您现在应该已进入容器 shell。


2. 手动克隆覆盖插件

导航到插件目录并克隆仓库:

cd /var/www/discourse/plugins
git clone https://github.com/constansino/discourse-moetwemoji-twemoji-fakepng-override.git

验证目录是否存在:

ls discourse-moetwemoji-twemoji-fakepng-override


3. 应用 Emoji 覆盖

返回 Discourse 根目录:

su - discourse
cd /var/www/discourse

检查当前状态(可选但推荐):

RAILS_ENV=production bundle exec rake moetwemoji_twemoji:status

应用覆盖:

RAILS_ENV=production bundle exec rake moetwemoji_twemoji:apply

如果命令在没有错误的情况下完成,则 Twemoji PNG 文件已被 Moetwemoji 替换。


4. 关于重建的重要说明(持久性)

:red_exclamation_mark: 无需重建即可使覆盖生效

覆盖版本通过直接替换正在运行的容器中的文件来工作。
因此:

  • :white_check_mark: 您不需要运行 ./launcher rebuild app

  • :white_check_mark: 运行 rake 任务后更改会立即生效

:warning: 但更改不具有持久性

因为这是在容器文件系统内部完成的:

  • 任何将来的 ./launcher rebuild app

  • 或容器重建/升级

都将清除更改,并且 emoji 覆盖将丢失。

:backhand_index_pointing_right: 如果您需要在重建后保持持久性,则必须通过 app.yml 钩子安装插件并正确重建。


5. 清除 CDN 和浏览器缓存(非常重要)

应用覆盖后,由于缓存,emoji 可能仍显示未更改。

5.1 清除 CDN 缓存(例如 Cloudflare)

如果您使用的是 Cloudflare 等 CDN:

  • 清除缓存:

    • /images/emoji/*

    • 如果有必要,执行完全缓存清除

否则,旧的 Twemoji PNG 文件可能仍会被提供。

5.2 清除浏览器缓存

在客户端:

  • 强制刷新页面(Ctrl + F5 / Cmd + Shift + R

  • 或清除浏览器缓存

  • 或在隐身/私密窗口中测试

在清除 CDN 和浏览器缓存之前,emoji 更改可能不会显示。


6. 总结

  • 此覆盖插件可以在不重建的情况下安装和应用

  • 手动安装可用于:

    • 测试

    • 临时使用

    • 调试

  • 缺点是缺乏持久性

  • 应用 emoji 覆盖后,务必清除CDN 缓存 + 浏览器缓存


您是否按照README中的说明运行了该任务?

本 README 提供了两种安装方法:

  1. 第一种方法需要重新构建。
  2. 第二种方法是手动进入容器并从 GitHub 下载。

这两种方法没有区别;前者只是更持久。如果在用第一种方法重新构建时下载失败,请考虑尝试第二种方法,即直接在容器内安装。这是因为它本质上是下载并替换现有的表情符号图像。

我注意到 Readme 文件解释了两种安装方法,但它也提到了:

cd /var/discourse
./launcher enter app

su - discourse
cd /var/www/discourse

RAILS_ENV=production bundle exec rake moetwemoji_twemoji:status
RAILS_ENV=production bundle exec rake moetwemoji_twemoji:apply

这在 Meta 上的第一篇帖子中没有提到。缓存信息也是如此。这就是我认为有人可能会遗漏它的原因。


顺便说一句,您在第一篇文章中的两个链接都包含一个 Google 搜索。您没有直接链接到 GitHub 是有什么原因吗?

1 个赞

为什么它被称为“moetwemoji”,而表情符号文件夹被称为“twemoji”,而动画表情符号是官方动画 Google Noto 表情符号

然而,这在此文件中有所提及,其中署名是不完整的。该文件据称仍在开发中,但我希望在分发您的主题组件之前,署名就已完成 :face_with_tongue:

4 个赞

抱歉,我的帖子可能不够详尽。我稍后会修改。感谢您的指正。

2 个赞

感谢您指出这一点——您完全正确。

这个命名是历史遗留的,来源于 Discourse 的默认 emoji 结构,但实际的动画资源来自 Google Noto Emoji,而不是 Twemoji。我同意这很令人困惑,需要澄清。

我目前正在:

  • 更新署名以完全遵守 Noto Emoji 许可
  • 在 README 中澄清资源来源
  • 审查命名/文件夹结构以减少混淆

感谢您的审阅和发现这个问题。

2 个赞

我将等待,因为尽管进行了操作,但它仍然不起作用,但是我的 Discourse 运行在我自己的 Ubuntu 服务器上的独立服务器上。我不知道我是否需要进行额外的缓存操作?

只需尝试
https://"yourdomain"/images/emoji/twemoji/hugs.png?v=15

https://"yourdomain"/images/emoji/twemoji/hugs.png?v=15&cache=0

两个网址都提供了非常稳定且不动的表情符号。因此,基于此,我看不出安装它的理由。是设备的问题吗?

我认为那些链接是用于在安装插件后测试它的。只要您不使用该插件,您就会看到该插件会替换的表情符号。

我实际上已经安装了,但什么也没看到。也许我应该在 Discourse 设置中使用其他表情符号或者其他什么,我不知道 [1]


  1. 另外我个人认为移动的元素是 90 年代的残余 :squinting_face_with_tongue: 所以我不太有动力深入研究这个问题。 ↩︎

抱歉,因为你说你没有看到安装它的理由,我以为你没有安装。

你运行了插件仓库的 readme 中解释的 rake 任务了吗? 我认为那是将动画表情符号放置在你尝试用链接访问它们的位置的地方。

1 个赞

我的错。我当时在用手机,懒得打字。

没有,我没做。

编辑。

我从来没读过自述文件,因为 OP 只提供了一个(没用的)谷歌搜索链接。现在我去了原始仓库,找到了本应或本可以放在 OP 里的信息。

1 个赞

我可以看到带有“https://“your_domain”/images/emoji/twemoji/hugs.png?v=15”的动画表情符号,但是在聊天中选择表情符号时它不起作用 :thinking:

为了简化复杂性,我建议您删除所有与不重建和进入容器进行克隆相关的部分。这是不必要的,也不是管理插件的标准方法。

几乎所有管理员都会定期重建,而持久性是最重要的方面,因此 app.yml 方法是最好的。

您也可以链接到标准说明,只详细说明独特的操作步骤。

3 个赞