在设置中,“icon”代表什么?
它是某个 SVG 网站上的图标确切名称吗?如何获取确切的名称?
在设置中,“icon”代表什么?
它是某个 SVG 网站上的图标确切名称吗?如何获取确切的名称?
这确实可能是一个很好的改进!
我正在查看代码并尝试修复以下两个问题,但卡在了第二个问题上。
类别图标列表 未在类别视图中应用(在“在此类别的主题上方显示子类别列表”开启时)我通过修改 header.html 第 112 行解决了这个问题:
if(iconItem && !attrs.category.parent_category_id) {
改为:
if (iconItem) {
并在 common.scss 中添加了以下代码:
.subcategory .category-icon-widget {
display: none;
}
类别锁定图标 未更改为新的 SVG类别视图:
类别视图(开启“在此类别的主题上方显示子类别列表”):
我认为相关代码如下:
let classNames = "badge-category clear-badge";
if (restricted) {
classNames += " restricted";
}
...
html +=
`<span ${style} ` +
'data-drop-close="true" class="' +
classNames +
'"' +
(description ? 'title="' + escapeExpression(description) + '" ' : "") +
">";
这段代码将 restricted 类添加到了具有 badge-category clear-badge 类的 <span> 元素上,从而控制子类别锁定图标的显示。但我无法确定如何也将此类应用到控制类别锁定图标显示的、具有 category-text-title 类的 <div> 元素上。
近期有实现的可能性吗?出于某种原因,“分类方框”视图也无法显示彩色圆点或锁定图标,因此这可能超出了该组件的控制范围……
错误 @pmusaraj
子类别的 slug(和标题)只需在其父类别内保持唯一即可
但 slug 在此组件中被用作查找图标的键。
因此,如果两个不同父类别下的子类别具有相同的 slug,图标将被同时应用到这两个子类别上。
说实话,我认为这实际上是 Discourse 本身的问题,因为 slug 在整个 Discourse 实例中应当是唯一的,但目前并非如此。
在组件内部是否有可能修复这个问题?
我不明白为什么 slugs 需要全局唯一,因为据我所知,它们从未具有全局作用域。你能解释一下吗?
附:我看到了你新发的主题,其中询问了为什么它们不唯一。
例如,类别图标组件使用 slug 来识别需要附加图标的类别。
管理员或用户如何唯一标识子类别?他们是否必须使用路径 parentcategory-subcategory?(或者在相关功能发布后使用 parent-child-grandchild)。这似乎有些繁琐。
组件很可能可以处理在不同父级下具有相同 slug 的子类别去重问题,但这需要在组件设置中传入父类别 slug 的机制。依我看,这样做不够优雅。
你能尝试更改两个具有相同 slug 的类别中其中一个的 slug 吗?是否有理由无法这样做(只需更改 slug,无需更改类别名称)?
是的,鉴于不同父分类下的子分类 slug 无需唯一,这似乎是可行的方案。
话虽如此,这实际上可以作为一个功能加以利用。例如,如果您拥有基于组别的分类,其中许多分类都包含“帮助”和“公告”子论坛,那么您只需两条条目,即可为所有“帮助”分类设置统一的帮助图标,并为所有“公告”分类设置统一图标。任何带有“帮助”标签的新子分类都会自动应用该图标。
针对我们的使用场景,我进一步将其扩展,使其支持对 slug 进行部分匹配。例如,条目“help,question-mark,#000080,false”将匹配“sw-help”、“help-forum”和“helpdesk”。
条目末尾的“false”附加项表示不强制要求完全匹配。
此外,我还提供了将颜色指定为“catcol”的选项,此时图标将自动采用分类颜色,而非使用单独指定的颜色。
这是供您参考的两个更新建议。
我认为该组件在某个阶段曾使用过部分匹配,但这让一些用户感到困惑,例如他们想要“book”的图标,却不想要“booking”的图标。不过,如果能按设置提供开关选项,这将会非常实用。(或许你可以将最后一项的 false 改为 partial-match,这样会更易于理解。)
这是一个很棒的改进。
我很乐意审查针对这两个功能中任意一个的 PR。谢谢!
Allow slug partial-match option by rogercreagh · Pull Request #5 · discourse/discourse-category-icons · GitHub 已合并,感谢 @rogerco!
我在类别颜色选项上遇到了一个小问题:如果设置中使用的是项目符号或方框而不是条形图,该选项就会失效——我最初只为条形图选项创建了它,在其他选项中会回退为灰色。我认为这主要可以通过 CSS 修复,但尚未找到解决方案——我一定能搞定!
感谢这个很棒的主题 @pmusaraj!![]()
我想使用 COMMENTS 图标,但不太喜欢实心版本。当我使用 comments 时,得到的是实心版本。通常,实心版本会以“fas fa-comments”的形式提供。
如果我想使用通常以“far fa-comments”形式提供的常规版本,该怎么办?
在以下变体中,有些需要付费订阅。有没有办法选择不同的变体,还是说只有实心版本可用?
在两个设置中都使用“far-comments”,如下所示:
付费版本未公开提供,因此我们无法将其包含在 Discourse 中。如果其许可证允许,您可以在主题的自定义 SVG 精灵中添加它们。相关完整说明请参阅 介绍 Font Awesome 5 和 SVG 图标,请仔细阅读“添加自定义图标”部分。
感谢您对此提供的帮助!在两个区域都添加 far-comments 后效果完美!
能否请您快速看一下我提出的另一个问题(这是对您在此话题中另一条评论的回复)…
你好,非常棒的主题组件!我在尝试添加 Font Awesome 图标或使用图标精灵上传时遇到了问题,目前只能显示 question-circle。请问我哪里做错了?是否需要添加 CSS 代码?
截图如下
以及
Font Awesome 名称总是提示“未找到”并建议创建?我尝试过直接使用名称和带前缀的名称,例如 bullhorn 或 fa-bullhorn。
更新:Font Awesome 已能正常工作。我在设置中找到了添加 SVG 图标的选项,但它没有像 question-circle 那样应用颜色设置。
我希望使用自定义 SVG 图标,但需要新手指南,请问该如何操作?
查看您个人资料中的网站,我看到有分类图标,所以也许您已经解决了这个问题?如果没有,根据上面的截图,我认为您需要确保 icons-sprite 中的 SVG 文件是一个 SVG 精灵文件(而不是单个图标)。更多详情参见 Replace Discourse's default SVG icons with custom icons in a theme