Tag Icons

Ok, iv gotten it to fit in the tag box how it looks nice but that’s for every tags box, iv found how to target specific tags but what would be the right way of selecting that tags box to put in the png icon?

trying to select one -

.tag-question::before {
    content: url(https://s2.coinmarketcap.com/static/img/coins/16x16/1.png);
    width: 8px;
    height: 4px;
    margin-right: 10px;
    margin-top: 3px;
    display:inline-block;
}

Selecting all -

a.discourse-tag.box::before {
    content: url(https://s2.coinmarketcap.com/static/img/coins/16x16/1.png);
    width: 8px;
    height: 4px;
    margin-right: 10px;
    margin-top: 3px;
    display:inline-block;
}

如果你还在找,我找到了这个网站,上面有很多国旗SVG图标,或许可以在Discourse上上传为自定义SVG图标,还不确定。\n\nhttps://www.flaticon.com/packs/search?word=flags&shape=lineal-color&order_by=4&type=icon

3 个赞

运行得很棒!这里有一些功能请求:

  1. 自动建议通过标签图标列表输入自动添加 svg-图标
  2. 将标签图标列表转换为 3 列表,其中可以自动完成标签和 font-awesome v5 图标
  3. 添加一个指向 Find the Perfect Icon for Your Project in Font Awesome 5 | Font Awesome 的链接,因为我一直在搜索最新的 font awesome(当前 v6)并想知道为什么我的输入不起作用。
  4. 采用 font awesome v6

感谢您提供这个。

1 个赞

在标签之间没有空格,有什么想法吗?只在手机上发生

截图

有两个已创建的标签因某种原因不起作用,这可能是个 bug 吗?我创建了带有 SVG 徽标 microphone-stand 的标签 interview,以及带有 SVG 徽标 camcorder 的标签 lecture。两者都显示为空白。


当我将这两个标签设置为使用我已用于另一个标签的 film SVG 徽标时,它们可以正常工作。所以,出于某种原因,我最初想使用的两个徽标未被接受。

有人能重现此问题吗?我可以在仅安装了此主题组件的干净开发环境中重现它。我如何查看正在使用哪个版本的 FontAwesome?也许我只是选择了 Discourse 版本中未包含的图标。我猜它使用的是 5.15 版本。由于这些图标包含在 5.11 或 6.0 中,因此应该包含在内。

1 个赞

我也无法让它们工作,所以可能是因为它们不包含在可用集合中。

1 个赞

您好!:waving_hand:t2:

我想知道是否可以使用一些像自然这样的图标和图片?

这是否适用于标签组中的标签?

我刚刚在一个私有类别中测试了你的 tag1,它有效。但是标签组中的标签似乎不起作用?

1 个赞

我遇到了类似的问题。似乎当标签超过 10 个字符时,图标将不显示。

已解决标签组问题。似乎需要直接将标签从组添加到类别,而不是添加标签组?

我无法在侧边栏以外的任何地方显示标签图标。有人知道为什么会这样吗?我尝试重新安装组件,只将该组件与默认主题一起使用,但仍然无效。

只是为了确认一下,您是否已将图标添加到主题组件的 svg icons 设置中?

2 个赞

是的,我看到了,你可以看到图标本身出现在侧边栏的左侧,但它们没有出现在其他任何地方:

您好,Darojax,欢迎 :wave:

我这边无法复现此问题。:thinking:

除非涉及到 CSS 或模板被覆盖,否则标签的渲染方式在任何地方都是一样的。

如果可能的话,您能分享一下您的论坛 URL 吗?

1 个赞

您好,感谢您的回复。遗憾的是,在此阶段论坛仍在开发中,尚未在互联网上开放。一旦我们公开,或者如果问题得到解决,我会再回复您。

1 个赞

好的,没问题。请提供您当前的 Discourse 版本并列出启用的插件/组件?这或许能给我们一些线索。

我会尝试仅启用“标签图标”组件,并使用默认主题,不进行任何 CSS 修改,看看问题是否会出现。如果不会,您就可以找出罪魁祸首了。

1 个赞

当然:

已安装的 Discourse 版本
3.2.0.beta2
(be04154838)

最新版本
3.2.0.beta2

我创建了一个全新的默认主题,并且仅通过 GitHub 直接安装了 Tag icons 组件:

以及两个插件:

discourse-landing-pages

docker_manager

没有进行其他 CSS、HTML 或自定义设置。

3 个赞

好的,我已找到问题所在。该插件似乎无法处理以大写字母开头的标签。我已将标签名称全部更改为小写,现在可以按预期工作。在我看来,以大写字母开头的标签看起来更整洁,如果能解决此问题将非常棒。: ) 但仍然感谢您提供了出色的组件。

1 个赞

我现在很高兴它能正常工作。但是,您是如何创建那些标签的?它们通常会被强制转换为小写。:thinking:

管理面板中有一个设置:

1 个赞

你说得对,我的错,我忘了这个设置了。:smile:

我知道问题出在哪里了,晚些时候我会提出一个修复方案。:+1:

3 个赞