如何在类别旁边显示 Font Awesome 图标?

我没有使用 PNG 图片,而是尝试使用 Font Awesome 图标,但它们显示异常。有什么办法可以让它们正常工作吗?

试试使用以下组件。我刚刚测试过,它正在运行:

嘿,tshenry。我看到了这个主题组件,但它显示在整个论坛中(而且仅在子分类中),我只是想让它显示在分类页面的分类块/列表中。Discourse 目前唯一的选项是放置一个 .png 图像。

.navigation-categories .category-text-title .category-name{
position: relative;
&:before{
    position: relative;
    font-family: "Font Awesome 5 Pro";
    content: "\f054";
    font-weight: 900;
}

这是我正在尝试的,使用 Font Awesome 图标。

同样的请求:

好的,你之前发布的 CSS 已不再适用。

我认为实现这一点的最佳方式是在 category-title-link 模板中添加一个插件出口(plugin outlet),并使用小部件在分类名称前添加相应的图标。让“分类图标”组件可选择性地在分类列表中显示分类图标,这个想法在我看来是合理的。如果你只希望图标在分类列表中显示,可以通过 CSS 将其隐藏在其他位置。

@pmusaraj 你怎么看?如果你认为这个想法不错,我可以先为插件出口提交一个 PR,然后再尝试为“分类图标”组件提交一个 PR 来实现此功能。

那太好了。@pmusaraj

这听起来不错,谢谢你调查此事。

@tshenry 关于此事有什么最新进展吗?

还没有,但我应该能在这周着手处理。

编辑: 我现在已经在组件的本地版本上实现了该功能:

我会尽力在明天提交必要的 PR,希望下周某个时候一切就绪。

此功能现已包含在 Category Icons 组件 中。为确保该功能正常运行,请确保您使用的是 最新版本的 Discourse 以及 该组件的最新版本