主题列表作者与发帖人

[Lilly (Lillian)]

	摘要	在主题列表页面的左侧列添加主题作者，并提供一个选项，仅在默认发帖人列中显示最近的发帖人。还可以调整作者头像的大小和形状。
	预览	https://discourse.theme-creator.io/theme/Lilly/discourse-topic-list-author-posters
	代码库	https://github.com/Lillinator/topic-list-author-posters
	安装指南	如何安装主题或主题组件

安装此主题组件

概述

此 Discourse 主题组件会将主题作者头像插入到所有主题列表路由的第一列，并设有允许管理员指定头像形状和大小的设置。此外，作者头像不会作为发帖人列表中的第一个头像显示。

还有一个设置，可使发帖人头像列仅显示最新的（最近的）发帖人，但前提是主题中有不止一名参与者。因此，只有当主题中有其他发帖人时，才会显示作者头像。

此外，管理员还可以选择在启用“最新主题列表”视图（即：“包含最新主题的分类”）时，在分类页面上显示主题作者，并且也提供头像大小和形状选项。

还有一个切换开关，用于将行内容垂直对齐到顶部或中间。

在小视口（移动端尺寸）下，作者将出现在最近发帖人头像的位置。

此组件与 主题列表摘要 和 Discourse AI 摘要要点 配合使用效果良好。

设置

组件管理页面中带有默认选项的设置截图

设置	描述
主题列表作者头像大小	主题列表页面路由中作者头像列的头像大小 - 小、中 或 大。
主题列表作者头像边框半径	主题列表页面路由中的头像圆角：0% = 方形 → 50% = 圆形。 tab_style = 左侧圆角
主题列表仅显示最后发帖人	仅在主题列表的发帖人列中显示最后发帖人的头像，但前提是主题中有不止一名参与者。
垂直对齐行顶部	切换开关，用于将行对齐到顶部或中间
在分类页面显示作者	在分类页面的主题列表中，显示作者头像而非最近发帖人。
分类页面主题头像大小	分类页面主题列表中作者头像列的头像大小 - 小、中 或 大。
分类页面头像边框半径	分类页面中的头像圆角：0% = 方形 → 50% = 圆形。 tab_style = 左侧圆角

截图

以下是一些具有不同头像大小和形状设置的截图，同时也展示了展开的 AI 摘要要点。

各种主题列表页面的截图，启用了不同的组件设置，展示了紧凑和展开的要点模式，以及展开/折叠的侧边栏

使用默认设置：

大型 tab_style 头像形状，摘要要点已展开：

小型头像，15% 边框半径形状，并启用了 Topic_list_show_last_poster_only：

中型头像，0% 边框半径（方形），启用了 Topic_list_show_last_poster_only，且摘要要点已展开：

分类页面截图，展示了作者或最后发帖人的两种不同大小和形状的头像。

默认组件设置，使用中型圆形头像，并启用了 Show_author_on_categories_page：

大型 tab_style 头像，并禁用了 Show_author_on_categories_page：

移动端尺寸视图截图

使用 tab_style 作者头像：

---

备注

• 在个人资料页面标签中预期位置插入作者头像并更改发帖人列。
• 在主题页脚列表（建议/相关主题）以及个人资料和收件箱标签页面中，移动设备行为与默认行为相同。
• 与 horizon 主题不太兼容。

---

可能的未来待办事项

• 添加移动端禁用切换开关？
• 分类和标签豁免？
• 从左到右的支持？
• 发帖人头像形状？

一如既往，感谢 @Moin 提供的想法、反馈和调试帮助。

---

查看我的其他 Discourse 作品

[jordanjay29]

感谢您制作这个，它立即为我解决了一个潜在的问题！

@Lilly

进一步的样式改进

也许这已经在计划中了，我想提一下我注意到左侧海报头像列的内边距和对齐方式有一个奇怪的缩进（与禁用组件的移动设备上不同，作为比较）。这看起来像是 td.posters 的 text-align 属性也影响了图像。
启用后，海报头像列表的对齐方式也会改变，这看起来像是 td.topic-list-data 的对齐方式覆盖了默认设置。如果您对这些其他方面满意，我自己修改样式表也很容易。

很棒的组件，再次感谢。

[Lilly (Lillian)]

感谢您的报告，我刚刚推送了一个修复。请更新组件并告知我这是否有帮助。

[jordanjay29]

头像在桌面端左对齐效果更好。我添加了以下 CSS 来根据我的偏好调整中间海报的列：

td.posters.topic-list-data {
    vertical-align: middle !important;
}

我认为您未来禁用的移动端设置也会有帮助，因为样式占用的空白空间有点多余。

[Lilly (Lillian)]

@jordanjay29

头像在桌面端左对齐更好。我添加了以下 CSS 来根据我的偏好调整中间发帖人的列：

顶部的垂直对齐是故意的，以与其余的主题卡保持一致，不会更改。
我没有对移动端做任何更改，但我会看一下。

[jordanjay29]

垂直对齐方式可能在您的 CSS 中应用得过于宽泛，可能只需要针对您使用 td.topic-list-data 的 custom-author-column。我怀疑将目标更改为 td.custom-author-column.topic-list-data 将会解决问题，并消除在我这边需要自定义样式来修复的必要性。

[Lilly (Lillian)]

不，我本来是希望“海报”列与其他所有行元素一起垂直对齐到顶部。居中对齐（尤其是在启用摘录或 AI 摘要时）看起来很突兀，但我想这只是个人品味问题，您可以根据自己的喜好进行调整。

我为移动端推送了一个小的更改。

[jordanjay29]

由于我的论坛不使用摘录、gist 或 AI 摘要，因此首选默认的 Discourse 外观。在我看来，这个更改更适合在专用的主题组件中进行，但我们的看法不同，我已经在我这边修复了它，所以没有芥蒂。

移动端看起来好了一点，谢谢！

[Lilly (Lillian)]

@jordanjay29 经过进一步考虑，我决定添加一个对齐切换（这很容易）。

给你

有一个新的设置 Vertically align row top（垂直对齐行顶部），你可以禁用它以获得默认的居中对齐。告诉我这是否对你有用。