全屏封面图

: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:

10 个赞

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

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

3 个赞

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

3 个赞

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

3 个赞

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

2 个赞

哈哈哈,太棒了——我论坛里的很多成员也上当了。有个在国外度假的人差点信以为真,正准备烧文件,突然想起今天是什么日子才反应过来。

2 个赞

我也是。我想我根本没看到一条“我早就知道”的评论。这个插曲让我意识到有多少人依赖我们的网站,因为我们收到了大量类似的评论:

我醒来,拿起手机,打开 SWAPD……心瞬间沉了下去。我的第一个念头是:“搞什么……我们是不是彻底完了?”
我就那样盯着天花板坐了好几分钟,心想:
我该去找份工作吗?
我该开始贩毒吗?
我该回大学读书吗?
昨晚这些甚至都不在我的计划里……但今天,它们却显得无比真实。我又刷新了几次页面,希望能有第二次机会……感谢上帝,网站恢复了。

现在我就在这里,吃着披萨,刷着帖子,嘲笑那些还认为 SWAPD 被查封的人。生活真美好。

1 个赞