首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >利用零宽字符制作PushMe HTML消息摘要

利用零宽字符制作PushMe HTML消息摘要

作者头像
LiesAuer
发布2026-03-10 17:17:21
发布2026-03-10 17:17:21
400
举报
文章被收录于专栏:LiesAuer's BlogLiesAuer's Blog

在使用 PushMe 推送 HTML 消息时,由于 PushMe 默认生成的消息摘要是自动提取的,在很多时候这个摘要并没有起到什么作用,特别是有表格等复杂数据时,如下图。

2025-09-06_094116.png
2025-09-06_094116.png

然后想着试下利用摘要不解析 HTML 的这个特性,使用一段display:none的文字作为消息摘要,在点进去正文时,解析 HTML 后也会看不见这段摘要。

刚开始尝试使用超多的 将正文部分推到很后的地方,摘要为摘要,正文为正文,但是自动提取出来的摘要会将连续空格转为单个,还是会导致正文出现在摘要里。

示例消息

代码语言:javascript
复制
<div style="display:none">这是简介     </div><div style="border: 10px solid #46bc99; text-align: center; font-size: 30px;">HTML</div>

然后又想到了零宽字符,看下会不会将零宽字符也转成单个空格,由于我博客不好插入能显示且能复制的零宽字符,所以就只能将方法放出来,自己操作一遍了,利用这个工具生成零宽字符:point_right: 零宽字符生成工具

810ada0c-e874-4a34-88b2-4c2a60c08859.png
810ada0c-e874-4a34-88b2-4c2a60c08859.png

当你正确生成且复制,内容应该是这样的,我们保留零宽字符部分即可

PixPin_2025-09-06_10-04-33.png
PixPin_2025-09-06_10-04-33.png

为了填充足够的摘要,不让正文显示出来,我们需要把整段零宽字符复制 15-20 遍,然后最终成品长这样

PixPin_2025-09-06_10-11-40.png
PixPin_2025-09-06_10-11-40.png

最终在 PushMe 的展示效果如下,就非常的 nice。

2025-09-06_101310.png
2025-09-06_101310.png
2025-09-06_101333.png
2025-09-06_101333.png
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2025-09-06,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档