Discourse Docs 卡片过滤器

[Discourse]

	Summary	Discourse Docs Card Filter is to be used with the Discourse Docs Plugin and allows you to place “Cards” that act as a clickable filter for quicker filter results upon entering the /docs page by your users.
	Preview	Preview on Discourse Theme Creator
	Repository Link	https://github.com/discourse/discourse-docs-card-filter
	New to Discourse Themes?	Beginner’s guide to using Discourse Themes

Install this theme component

As this is an official theme component maintained by the Discourse team, support, bug, ux, and feature requests can be made in the respective categories here on Meta, and tagged with the appropriate theme component tag. Click on a link below to get one started.

 Support  Bug  UX  Feature

Features

The above would be rendered with these settings in the docs plugin:

Settings

You can select custom icons for each category or tag card filter. You can also allow category descriptions to be rendered in the category card filters.

Name	Description
category icons	Choose icons & topics order for corresponding category IDs. ex. ‘6,heart,title-asc’ would assign the heart icon to category 6 & will order topic list by ascending activity. NOTE: order can be (title,activity)-(asc/desc)
category description	Enable the category description to be displayed in the category card filters for the docs page.
tag icons	Choose icons & topics order for corresponding tag slugs. ex. ‘featured,heart,activity-desc’ would assign the heart icon to featured tag & will order topic list by ascending activity. NOTE: order can be (title,activity)-(asc/desc)

Translation	Default
topics	Topics
topic	Topic

Hosted by us? Theme components are available to use on our Standard, Business, and Enterprise plans.

Last edited by @JammyDodger 2024-06-12T08:47:57Z

Check document

Perform check on document:

[downey (Michael Downey)]

Thanks for building this! Is it the case that if a user doesn’t have view permissions on a (private) category, the card for that private category won’t appear above the search box? (Or I suppose on the sidebar, but just want to confirm the behavior is consistent.)

[jordan.vidrine]

This should be the case as we are getting the category info from

@discourseComputed("category")
  categoryInfo(category) {
    return this.site.categories.findBy("id", category.id);
  },

To my knowledge, this.site.categories will only return those the current user can view.

[downey (Michael Downey)]

Excellent. That will make it a real easy-to-use tool for people in our multiple workgroups who want quick access to their group(s) reference materials, and quickly filter our Group A from Group B, etc. Thanks!

[MarcP]

Is it possible that the counter on /docs does not count topics moved into that category after it is already created?

I just made a new category, added in docs, moved a few topics but the counter still says “0 topic”.

EDIT: seems it just takes a while to update.

[Nick_Chomey]

是否有办法更改卡片的排序顺序，即使需要修改代码？我希望它是按字母顺序而不是按主题计数。谢谢！

[mallen (Mike)]

大家好。文档和这个文档的扩展都非常棒。但只有一件事。有人能帮我把这些卡片添加到 top_menu 或 homepage 部分吗？很希望能有一个默认显示“最新”的标准主页，同时将这些卡片放在顶部。然后点击卡片会跳转到过滤后的文档页面。

另外，我还有另一个插件（搜索框）位于 top_menu 部分。我一直没弄清楚如何更改此部分中多个插件的顺序。

谢谢。

[jrgong]

嘿 @jordan.vidrine

我们试用了 tc，它非常适合你的用例。现在我们可以创建一个 KB。

在这种情况下，我有一个问题：你能否建议一种方法，为每个类别或标签卡添加一些参数？这样我们就可以追加 &order=title 以影响每个单独类别或标签卡的排序。

PS：

[jordan.vidrine]

嗯……我不确定。

您希望类别和标签卡片的排序如何显示？

[jrgong]

嘿 Jordan

我们可以在 category icons 主题设置中添加一个排序参数。例如，对于 6,heart，我们可以添加一个额外的排序命令，例如按主题标题升序排序，它将是 6,heart,title-asc。

打开类别卡时，它只会附加文档参数，例如：/docs?ascending=true&category=71&order=title

你觉得怎么样？

[jordan.vidrine]

虽然这可能在某个网站上效果很好，但由于围绕此主题关于卡片排序能力的内容不多，因此我认为目前投入时间来正确实现这一点并不值得。

话虽如此，我们确实鼓励对组件进行 PR，以及 fork 组件以供您自己使用！

请随时为此功能提交 PR，或 fork 它以供您自己开发。

[Ahmed_Gagan]

@jordan.vidrine

即便如此，我们仍然鼓励对组件进行 PR

由于 @jrgong 赞助了这项工作，我可以为这个请求创建一个 PR。

[jrgong]

@Nick_Chomey

有没有办法更改卡片的排序顺序，即使需要修改代码？我希望它是按字母顺序而不是按主题计数。谢谢！

顶一下！有人能解决这个问题吗？

[Nick_Chomey]

我的解决方案是关闭卡片（因为我的产品类别太多，它们没什么用），并修改文档的排序顺序。您可以在此处了解更多信息：Modifying Discourse Docs to only allow for sorting by Title - #2 by Nick_Chomey

[jordan.vidrine]

我们非常欢迎为我们的组件做出有益的拉取请求！

如果你要添加对这些卡片进行排序的功能，我建议创建一个新的值列表，你可以在其中按类别 ID 和标签 ID 设置卡片的顺序。我不会将它们添加到已有的、不相关的价值列表中。

[Lishuo_Lin]

@jordan.vidrine 感谢您设计出色的组件。有没有办法在移动设备上禁用该组件，但在 PC/Mac 上显示？

[jrgong]

没问题。但您能否至少将 category icons 设置更改为值列表？与单个文本字段相比，在多个文本字段中管理卡片要容易得多。

作为临时解决方法，如果每个文档卡片都有一个带有相应类别或标签 slug 的 CSS 类，那将非常有帮助。

之前：<a>
之后：<a>

[jordan.vidrine]

这是一个很好的建议

[jrgong]

如果您需要测试方面的帮助，请告诉我，我很乐意充当小白鼠

[jordan.vidrine]

经过进一步考虑，我决定不将 category icons 设置更改为值列表，因为没有备用选项，这会导致当前用户的组件损坏。

添加备用选项将是检查用户是否在当前字段或新的 value-list 字段中设置了图标，我觉得这对于添加到此组件来说过于麻烦，因为它会增加另一层设置并可能引起混淆。

至于类添加，这是一个好主意，但我无法确定何时会添加，因为有更重要的事情需要我关注。

话虽如此，但只要有可能，我们也欢迎对我们的组件进行 PR，毕竟我们是开源的！