| 摘要 | 博客文章样式允许您指定一个博客分类,从而改变该分类内主题的外观,使其更像传统博客文章。 | |
| 预览 | 在 theme-creator.discourse.org 上预览 | |
| 仓库 | github.com/discourse/discourse-blog-post-styling | |
| 初次使用 Discourse 主题? | Discourse 主题使用入门指南 |
安装此主题组件
博客文章样式主题组件将 Discourse 主题转换为传统博客文章布局。当应用于某个分类时,每个主题中的第一张图片会被提升为标题上方的全宽英雄图,内容则采用适合博客的排版和元数据显示样式。
设置
以下是与此主题组件相关的各种设置:
-
博客分类:属于所选分类的主题将应用博客文章样式。
-
博客标签:选择一个或多个标签,当应用于主题时,将赋予其博客文章样式。
-
图片尺寸:决定特色英雄图如何填充标题区域:
无图片:隐藏特色图片。全宽(默认):图片横跨整个内容区域。居中:图片保持宽高比并居中显示在内容区域。
-
图片位置:决定图片相对于标题的显示位置:
标题上方(默认):在主题标题上方显示图片。标题下方:在主题标题下方显示图片。选择此项时,您还可以包含一个摘要,显示在标题和图片之间。下方展示了当图片位置设置为标题上方和标题下方时图片的显示效果:
- 启用首字下沉:启用后,博客文章的首字母将采用放大样式,如下所示:
- 启用移动端:启用后,在移动设备上阅读主题时将应用博客文章样式。
撰写博客文章
设置好博客分类(或应用博客文章标签)后,请注意博客文章主题运行的几个特殊事项。
特色图片
将您希望作为英雄图的图片放在帖子的第一行,然后在内容开始前留一个空行:

您的帖子内容从这里开始...
该组件会根据图片位置设置(见上文)自动定位此图片。如果在图片之前出现任何其他内容(包括空行),图片将不会被提升为英雄图位置。
首次发布帖子后,请刷新页面以查看图片出现在指定位置。(这仅影响作者在首次发布时的视图;访问帖子的成员应立即看到图片在正确位置。)
图片尺寸技巧
图片容器高度为 440px,宽度为 100%。当图片尺寸设置为 全宽 时,为获得最佳效果:
- 在上传前使用或裁剪图片至 1100x400px 以避免裁剪,或
- 选择主体居中或内容非特定的图片(如风景、图案),以免裁剪掉重要细节。
摘要
当图片位置设置为 标题下方 时,您可以为博客文章添加可选摘要,该摘要将显示在标题和特色图片之间。
为此,请按以下方式包裹您希望出现在摘要中的内容:
[summary] 这里将是您的摘要内容。[/summary]
样式化引用块
在博客分类中创建主题时,引用块将获得特殊样式。您可以在编辑器中使用 > 符号或使用 “ 编辑器工具栏按钮创建引用块。
推荐的分类设置
在您的博客分类设置中,建议启用阅读主题后跳转至首帖分类设置。这将使返回的读者直接跳转到博客文章内容,而不是他们上次阅读的位置。
博客文章样式 + 主题列表缩略图
此组件与 主题列表缩略图 兼容,后者会在主题列表中突出显示您博客文章的特色图片:
注意:主题列表缩略图组件与 Horizon 主题不兼容。上述截图使用的是 Foundation 主题。





