全屏封面图

:information_source: 摘要 一个 Discourse 主题组件,在页面加载时在整个论坛上方显示全屏封面图像。
:hammer_and_wrench: 代码仓库 GitHub - communiteq/discourse-tc-fullscreen-coverimage · GitHub
:question: 安装指南 如何安装主题或主题组件
:open_book: 刚接触 Discourse 主题? Discourse 主题使用入门指南

安装此主题组件

一个 Discourse 主题组件,在页面加载时在整个论坛上方显示全屏封面图像。

最初是为某个政府机构(“本网站已被查封”)开发的,但足够通用,适用于任何场景——如维护通知、启动画面、活动公告等。

工作原理

页面加载时,图像会在屏幕中央渲染,并缩放以尽可能填满视口,同时保持其宽高比(object-fit: contain)。图像之外的剩余区域将由可配置的背景色填充。

当满足以下任一条件时,叠加层将消失:

  • 经过配置的秒数,或
  • 用户点击叠加层达到配置的次数

将任一值设置为 0 即可禁用该关闭方式。

设置

设置项 类型 默认值 说明
cover_image 上传 (无) 要全屏显示的图像
trigger_after 字符串 (无) 叠加层激活的 ISO-8601 UTC 日期时间,例如 2026-04-01T08:00:00Z
display_seconds 整数 5 自动关闭前的秒数(0 = 永不)
dismiss_on_clicks 整数 3 需要点击次数以关闭(0 = 禁用)
background_color 字符串 #000000 图像外部区域的 CSS 颜色

Cookie 行为

一旦访问者通过计时器或点击关闭了叠加层,系统将设置一个名为 tc_coverimage_seen 的 Cookie,记录 trigger_after 的值。除非将 trigger_after 更改为新值,否则叠加层不会再次显示——这将重置所有用户的“已查看”状态,并在他们下次导航页面时重新显示。

示例

设置 trigger_after: "2026-04-01T00:00:00Z"display_seconds: 0dismiss_on_clicks: 1,即可实现一个在 4 月 1 日 UTC 午夜激活的单点击启动画面,每位访问者仅显示一次。

显然,此主题组件并非为政府机构开发,而是由 @WorldIsMine 开发并慷慨开源的 :smiling_face_with_three_hearts:

6 个赞

太棒了!我今天就要在我的论坛上玩这一招:grin:

很棒的组件,谢谢!:slight_smile:

1 个赞

你可以在今天(仅限今天)的 SWAPD 上亲眼目睹这一幕。我得说,这个愚人节玩笑简直突破了底线,它让 几乎每位成员都吓得心跳骤停。

2 个赞

现在想来,这将来会很有用,能确保每个人都看到你希望发布的通知。

2 个赞

哈哈,我喜欢!嘿,伙计们,好笑话!