过滤的主题列表

[gormus (Osman Görmüş)]

	摘要	允许使用过滤器创建自定义主题列表。然后，这些列表可以显示在选定页面的选定插件插槽中。
	预览	Theme Creator
: hammer_and_wrench:	仓库	https://github.com/gormus/discourse-filtered-topic-lists
: question:	安装指南	如何安装主题或主题组件
: open_book:	刚接触 Discourse 主题？	Discourse 主题使用入门指南

安装此主题组件

允许使用主题过滤器创建自定义主题列表。然后，这些列表可以显示在选定页面的选定插件插槽中。

您可以根据需要创建任意数量的列表，定义它们的标题、应列出的主题数量、用于查询的过滤器，最重要的是它们应显示在哪些页面以及在这些页面的何处。

请务必查看实验性主题列表过滤器功能和支持的过滤器：

Experimental topics list filter feature

We have recently introduced an innovative /filter route, enabling more sophisticated filtering of the topics list. Significantly, this marks the initial step towards a unified topic filtering language for both search and filtering. Additionally, the dedicated route for topic list filtering enhances the customizability of the sidebar, as users can now incorporate links as custom section links within the sidebar. How to turn it on Enable the experimental_topics_filter site settings in the admin i…

设置

• 标题: 可选的标题文本；如果提供，则显示在主题列表上方。

• 长度: 要显示的主题数量。

• 查询: 用于过滤列表的查询

• 插件插槽: 精选的主题列表可以放置在以下插件插槽/区域：

  • below-site-header
  • above-main-container
  • before-topic-list
  • after-topic-list
  • topic-list-bottom
  • main-outlet-bottom
  • before-main-outlet

• 显示在: 显示列表的页面。

  • everywhere: 显示在所有页面，除了 /admin 页面。
  • homepage
  • top_menu: 检查您的 top menu 设置，了解启用的页面。
  • categories: /categories 页面。
  • latest: /latest 页面。
  • top
  • new
  • unread
  • read
  • posted
  • bookmarks
  • hot
  • selected_categories:
  • selected_tags

• 选定类别: 当“显示在”设置为 selected_categories 时，将使用此字段中选择的类别。主题列表仅在此类页面上显示。

• 选定标签: 当“显示在”设置为 selected_tags 时，将使用此字段中选择的标签。主题列表仅在此类标签页面上显示。

插件插槽

所有可用的插件插槽都用红色虚线框起来显示。

灵感

我受到了“精选列表”主题组件的启发。但最终，我需要一个不那么主观、更灵活的解决方案来完成我的项目。

请务必查看：

Featured Lists

Summary Create and feature custom topic lists Repository Manuel Kostka / Discourse / Components / Featured Lists · GitLab Install Guide How to install a theme or theme component New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component The component lets you filter custom topic lists and showcase them on your forum. Default look [image] Settings Editor [image] Stylin…

[Heliosurge (Dan DeMontmorency)]

这很酷

它是否使用相同的可定位类，以便您可以设置组件的样式？

您能否在几个出口处添加一些自定义列表的示例？

谢谢

[gormus (Osman Görmüş)]

@Heliosurge

它是否使用相同的可定位类，以便您可以设置组件的样式？

是的，过滤后的主题列表表使用与主主题列表表相同的 CSS 类。此外，还有包装的 DIV 元素带有类，这有助于您在任何插件出口中自定义主题列表表。

下面您可以看到层次结构，请注意 .topic-list 是 TABLE 元素的默认标识符。如果需要，您还可以定位特定的插件出口以应用不同的样式；请参阅第二个代码块；

.filtered-topics-list {
    &__wrapper {
    }

    &__header {
        h2 {
        }
    }

    &__content.topic-list {
    }
}

.filtered-topics-list {
    &.below-site-header,
    &.above-main-container,
    &.before-topic-list,
    &.after-topic-list,
    &.topic-list-bottom,
    &.main-outlet-bottom,
    &.before-main-outlet {

        &__wrapper {
        }

        &__header {
            h2 {
            }
        }

        &__content.topic-list {
        }
    }
}

@Heliosurge

您能否在几个出口中添加一些自定义列表的示例？

我没有演示网站可以向您展示，但我分享了一张截图，其中显示了所有可用的插件出口以及各种过滤后的主题列表。

请忽略它们周围的红色虚线规则，我只添加它们是为了突出显示表格以及它们所在的区域。

[bekircem]

我将 /latest 用作主页。我使用此组件将特定类别的最新主题添加到我的主页，但我希望删除标准的无限滚动 Discourse 最新主题组件。我通过 CSS 做到了这一点，但这也会影响其他页面。是否可以使用 CSS 选择器仅针对主页上的最新主题组件？

[manuel (Manuel Kostka)]

我认为您需要使用 JavaScript 查询路由并添加自定义类。这是一个您可以遵循的示例：

https://gitlab.com/manuelkostka/discourse/helpers/css-classes/-/blob/main/javascripts/discourse/api-initializers/css-classes.js?ref_type=heads

[jrgong]

发现了一个 bug（还是预期行为？）：

在类别中设置 默认列表过滤器：无子类别 会阻止在任何出口显示任何已过滤的主题列表。

已在最新的稳定版 3.3.1 上进行测试。

[gormus (Osman Görmüş)]

你好 @jrgong，可以分享一下你的预设截图吗？

[jrgong]

已私信发送我的预设给你

[jrgong]

还有一个问题：在显示特定类别的过滤列表时，隐藏核心主题列表的最佳方法是什么？

我发现唯一可以通过 CSS 实现的方法是定位 span 标签，但这可能会在不同情况下触发：

span + table.topic-list.topic-thumbnails-grid {
  display: none;
}

[gormus (Osman Görmüş)]

@jrgong

在分类中设置 默认列表过滤器：无子分类 会阻止任何过滤后的主题列表在任何出口中显示。

你好 @jrgong 我可以确认你的发现。

重现步骤：

1. 创建一个分类和子分类。例如 顶级分类 和 顶级分类 > 子分类
2. 编辑 顶级分类 设置 (/c/top-level-category/edit/settings)
3. 在“外观”下，找到 默认列表过滤器 设置。
4. 将值从 所有主题 更改为 无子分类
5. 在“过滤主题列表”组件中配置一个新的预设，以在顶级分类和子分类中列出其内容；
   1. 设置 显示在 = selected_categories
   2. 设置 选定的分类 = 顶级分类, 子分类
   3. 设置 插件出口 = (any)
6. 查看每个分类页面

预期结果：

两个分类页面都应在选定的插件出口上显示配置的预设结果。

发现结果：

1. 任何设置了 默认列表过滤器 = 无子分类 的分类，都不会显示过滤后的主题列表；无论它是否有子分类。
2. 但是，如果设置了 显示在 = everywhere，则会在选定的出口中显示过滤后的主题列表。

类似问题：

Routing issue when adjusting topic list filters

There is currently a routing bug reproducible under fairly specific conditions: Prerequisites Category with a subcategory Default List Filter category setting should be “no subcategories” for the parent category Solved plugin installed show_filter_by_solved_status site setting enabled enable solved globally or at least for the involved categories Repro steps Change the solved/unsolved filter from the default of “all” to “solved” Change the subcategory filter from the default of “none”…

Events: If subcategories hidden, so is the events calendar

If you have an events_calendar_categories set in that category’s settings set Default List Filter to be no subcategories then the events calendar is not displayed. I discovered this when making a subcategory to house expired events (as an alternative to deleting them).

[MihirR (Mihir)]

当我添加一个自定义字段，比如一个名为 X 的过滤器，其中包含 10 个最近的主题，并且当这 10 个主题被滚动浏览完后，假设“最新”开始显示，如果其中一个或多个主题仍然存在，它们会在两者中都显示。有没有办法将它们从“最新”或过滤器中隐藏？

[agemo]

很棒的插件功能！

问：插件出口 : before-main-outlet

我们如何才能显示它，我没看到。我需要启用/禁用标准主题中的某些内容才能使其像 Layton GFX 一样占据屏幕右侧吗？

[agemo]

嗯，我找到了，或者至少瞥见了它，因为它出现在无限滚动的底部，而不是像预期的或从视觉指南中预期的那样出现在右侧。