给子比主题(Zibll)的会员购买弹窗加一张仿哔哩哔哩的 22 / 33 看板娘背景,只需要把 CSS 加到自定义样式里,不用改任何主题文件。
效果
给会员购买弹窗增加哔哩哔哩背景后,主要有这些好处:
- 提升视觉趣味性:22 / 33 看板娘出现在弹窗底部两侧,弱化付费表单的枯燥感,让页面更活泼。
- 强化品牌氛围:B 站元素自带「会员 / 付费」的认知暗示,用户对开通 VIP 的接受度更高。
- 不遮挡核心信息:背景图定位在底部左右角落,尺寸控制在 20%,完全不会挡住价格、权益、支付按钮。
- 零文件改动:只写入后台「自定义 CSS」或主题的 CSS 选项,升级子比主题不丢失、不白屏。
下面是使用前(默认白底弹窗)与使用后(已加 bilibili 看板娘背景)的对比:

教程
将下方代码放置于后台 → 外观 → 自定义 → 额外 CSS(或主题自带的「自定义代码 → 自定义 CSS」)中,保存即可生效。
注意:下面代码直接引用了 B 站官方的 22_open / 33_open 图片地址。如果你担心外链失效或被防盗链,建议先把两张图下载到自己站点的 /wp-content/uploads/ 目录,再把 URL 替换掉。
代码说明:
- .payvip-modal 是子比主题会员购买弹窗最外层容器的类名。
- background-image 同时引入 22(蓝发)和 33(白发)两张 PNG,分别显示在左下角和右下角。
- background-position: 0 100%, 100% 100% 把两张图分别固定在左下、右下。
- background-size: 20% 把单张图宽度限制在弹窗宽度的 20%,避免遮挡文字和按钮。
如果你的弹窗类名不是 .payvip-modal,请用浏览器 F12 审查弹窗最外层容器,把类名替换即可。






暂无评论内容