配置自定义表情符号

[Discourse]

本指南说明了如何在您的 Discourse 站点上配置自定义表情符号。

所需用户级别：管理员

配置自定义表情符号

想要更改您的 Discourse 站点的表情符号？让我们看看如何为您的 Discourse 站点配置自定义表情符号，包括选择表情符号集、上传新表情符号以及调整表情符号大小。

选择表情符号集

Discourse 附带七种不同的表情符号集：

• 苹果/国际风格
• 谷歌风格
• 推特风格
• Emoji One 风格
• Win10 风格
• 谷歌经典
• Facebook Messenger

您可以在 /admin/config/emoji/settings?filter=emoji%20set 处选择表情符号集，以及其他与表情符号相关的设置。

添加自定义表情符号

要添加自定义表情符号：

1. 导航至：Discourse 管理 - 配置 - 表情符号，路径为 /admin/config/emoji
2. 您可以：
   • 输入名称并点击 添加表情符号 以上传图片作为表情符号
   • 将最多 10 个文件拖放到 名称 字段中进行批量上传；文件名将用作表情符号名称。

表情符号设置

您可以访问 /admin/config/emoji/settings 处的表情符号设置，以自定义表情符号在您的站点上的行为方式。

• enable_emoji - 启用您的 Discourse 实例中表情符号的显示和使用。如果禁用，表情符号将不会被渲染，用户将无法在文本字段中访问或使用它们。
• emoji_set - 选择您首选的表情符号样式。不同的表情符号集可以为站点上显示的表情符号提供独特的外观。
• max_emojis_in_title - 主题标题中允许的最大表情符号数（默认值：1）。如果设置值为零，则禁止在主题标题中使用任何表情符号。
• enable_emoji_shortcuts - 常见的笑脸文本，如 :) :p :( 将被转换为表情符号。
• emoji_autocomplete_min_chars - 触发自动完成表情符号弹出窗口所需的最小字符数（默认值：0）。
• enable_inline_emoji_translation - 为内联表情符号（前面没有空格或标点符号）启用翻译。
• emoji_deny_list - 这些表情符号将不可在菜单或简码中使用。
• external_emoji_url - 表情符号图片的外部服务 URL（默认值：https://emoji.discourse-cdn.com）。留空则禁用。
• discourse_reactions_enabled_reactions - 定义已启用反应的列表，此处允许任何表情符号。默认反应包括：心形、大笑、哭泣、爆炸头、鼓掌、五彩纸屑球、拥抱、大厨之吻、100、+1、火箭、惊奇、Discourse 标志和眼睛。
• discourse_reactions_excluded_from_like - 不计为“赞”的反应。不在此列表中的任何反应都将计为“赞”，用于徽章、报告和其他目的。
• discourse_reactions_allow_any_emoji - 如果启用此项，将添加一个按钮，允许用户在反应选择器中选择任何表情符号。成员将被允许为反应选择任何表情符号，包括自定义表情符号。要限制可用反应，请使用 emoji_deny_list 站点设置。

调整自定义表情符号大小

默认情况下，所有表情符号都通过 CSS 调整为 20x20 像素，但这可以通过自定义 CSS 覆盖。要在帖子中保持正确的纵横比和原生大小，请添加以下 CSS：

/* 使表情符号恢复正常大小（不强制为方形） */
div.topic-post img.emoji[src*="uploads"], 
div.d-editor-preview img.emoji[src*="uploads"], 
div.emoji-modal img.emoji[src*="uploads"], 
div.d-editor-textarea-wrapper img.emoji[src*="uploads"], 
div.title-wrapper img.emoji[src*="uploads"], 
td.main-link img.emoji[src*="uploads"] {
    width: auto;
    height: auto;
}

要自定义特定表情符号的大小，请使用：

img.emoji[title=":youremoji:"] { 
    height: XXpx; 
    width: YYpx; 
}

要调整聊天消息和聊天中用户状态的表情符号大小：

div.chat-message-text img.emoji[src*="uploads"], 
span.user-status-message img.emoji[src*="uploads"] {
    width: auto;
    height: auto;
}