功能特性
系统会为列表生成优化后的图片,并为高分辨率显示屏提供不同分辨率的版本。图片会随滚动懒加载(在浏览器原生支持的情况下)。
默认情况下,Discourse 将使用主题原始回复(OP)中的第一张图片。如果您希望从 OP 中选择另一张图片作为缩略图,请在 Markdown 中添加 |thumbnail。例如:

 << 这一张将作为缩略图
共有五种显示模式,可通过主题设置按分类或标签进行配置。
例如:
网格模式:
瀑布流模式:
列表模式:
技巧与提示
如果您希望帖子中的 Onebox 生成缩略图,需要启用以下站点设置:download_remote_images_to_local。此外,您还需要重新烘焙相关帖子。
设置项
| 名称 |
描述 |
default_thumbnail_mode |
默认使用的缩略图显示模式 |
docs_thumbnail_mode |
如果启用了 docs 插件,则用于文档主题的缩略图显示模式 |
blog_style_categories |
在这些分类中使用博客风格视图。该样式会利用主题或主题组件中启用的主题摘录功能 |
minimal_grid_categories |
在这些分类中使用极简网格视图 |
grid_categories |
在这些分类中使用网格视图 |
masonry_categories |
在这些分类中使用瀑布流视图 |
list_categories |
在这些分类中使用列表视图 |
blog_style_tags |
|
minimal_grid_tags |
为这些标签使用极简网格视图 |
grid_tags |
为这些标签使用网格视图 |
masonry_tags |
为这些标签使用瀑布流视图 |
list_tags |
为这些标签使用列表视图 |
suggested_topics_mode |
推荐主题应使用的缩略图显示模式?如果留空,将遵循“在主题列表之外启用”的设置 |
enable_outside_topic_lists |
在非主题列表页面(如用户活动、私人消息、推荐主题)上启用缩略图 |
placeholder_icon |
用于没有缩略图的主题的图标 |
mobile_thumbnails |
在移动设备上启用缩略图 |
list_thumbnail_size |
“列表”视图中缩略图的基础尺寸 |
由我们托管? 主题组件可在我们的专业版、商业版和企业版计划中使用。
92 个赞
好奇这个想法是从哪儿来的?

核心团队更加关注图片的交付和呈现,这真是太棒了!我喜欢这个方向!
(如果这不能完全取代“主题列表预览”,但至少有可能消除大量需要定制开发的 API 工作,这样我就不用再维护它们了,太棒了!)
附:我刚测试了一下,如果投票能生成缩略图,让图表能够显示出来,那就更好了……
37 个赞
Krischan
(Krischan)
161
这是一个很棒的功能。这是否如这里提到的随 Discourse 2.7 一同发布?还是语法有所不同?
2 个赞
david
(David Taylor)
162
是的,它已在 Discourse 2.7 稳定版中可用。语法是一样的 
4 个赞
我遇到了一个非常奇怪的问题,仅影响我网站上的某一位成员。部分缩略图似乎随机无法显示,系统显示为默认图标,仿佛没有图片一样;但对我本人及其他所有用户而言,缩略图都能正常显示。我让他检查了浏览器控制台,未发现任何相关信息,日志中也没有任何记录。我让他尝试清除缓存、更换不同浏览器和设备,甚至更换了不同的网络服务提供商。我还让他尝试了一个仅启用该组件的主题。无论他如何尝试,问题依然存在。我甚至尝试模拟他的身份登录,但在我这里问题并未出现。关于故障排查,大家还有其他建议吗?谢谢!
2 个赞
让他尝试在移动设备上关闭 Wi-Fi,这样就不会经过家庭网络,而是使用蜂窝网络。这将排除其家庭网络中任何可能造成的干扰。
但如果你已经尝试过“更换不同的 ISP”,那可能就不是这个问题了。
2 个赞
bartv
(Bart )
165
我无法再让此功能生效了,这是否被撤销了?
此外,该功能对普通用户来说不易发现。是否可以在预览的“尺寸选择”中添加一个选项来选取缩略图?
5 个赞
谢谢 Jeff。他尝试过用手机热点,也去过朋友家使用不同的网络服务商。我起初怀疑是 CDN 的问题,因此尝试清除了 CDN 缓存,但这对他没有帮助。我还尝试过在使用位于他家乡亚特兰大的 VPN 时模拟他的操作,同样没有效果。我不确定还有什么其他方法可以尝试。
2 个赞
david
(David Taylor)
168
对我来说它仍然有效。您能提供更多细节,说明您尝试了什么以及看到了什么结果吗?我在我的测试原始帖子中有以下内容:


第二张图片被正确选为缩略图。
我同意那样会很棒,但我不认为大多数网站都需要它。我认为这会成为一个很好的独立主题组件。
3 个赞
你好 @david,
我有以下需求,或许你能指点我如何实现。
有时我们有一个想要在社交媒体上分享的主题,并为此准备了一张图片,用作缩略图和 og:image 标签,但我们不希望它在主题内容中显示。
如何实现类似的功能呢?例如,在尺寸参数中添加“hide”,然后为图片容器添加一个应用了"display: none;"的类?

3 个赞
david
(David Taylor)
171
你可以尝试使用 Generic bbcode wrapper for theme components 来实现类似以下功能:
[wrap=hidden]

[/wrap]
然后添加一些 CSS 样式:
div[data-wrap="hidden"] {
display: none;
}
10 个赞
alert-info 横幅覆盖了缩略图,这是设计如此还是存在缺陷?
3 个赞
david
(David Taylor)
175
这在一定程度上是设计使然。通常情况下,该栏位于主题列表的列标题上方。另一种方案是当该栏出现时“向下推挤”所有主题,但这会导致整个界面突然下移,可能会显得非常突兀。
我不确定为何您的截图中该栏右侧存在约 1 像素的间隙。这可能是组件本身的问题,也可能与您的自定义主题 CSS 有关。
4 个赞
bartv
(Bart )
177
是否可以在缩略图卡片上显示点赞数量,并使其可点击,以便用户直接从画廊视图点赞图片?
4 个赞
th21
178
即使在勾选“在移动设备上启用缩略图”后,列表分类在移动模式下仍无法正常工作?
2 个赞
你好,这真的很酷。
是否可以使用热链接图片(例如来自 Imgur 的)作为缩略图?
2 个赞
你好,我刚刚将博客分类设置为使用列表分类,但它显示在所有分类中,是不是我哪里设置错了?
2 个赞