本文是《技术栈(共26篇)》目录的第 26 篇。阅读本文前,建议先阅读本文前3篇文章:

阅读本目录下更多其它文章

AI摘要
根据文章内容生成

本文讲述了一款typecho插件,它能自动显示顶部横幅和弹窗,并设置庄重或喜庆纪念日,以适配网站节日氛围。

前几天九一八的时候,我把网站变成了灰白色,本来是一段平平无奇的代码插入到header或者footer中,后来想想干脆一劳永逸,就把主题集成了,随着想法越来越多,就逐渐加了弹窗、显示日期这些,好容易集成完了,又有了想法,想着其他人可能也会用,干脆做成插件吧,所以就有了这个。

插件的逻辑

插件一共4个功能:顶部条幅、庄重纪念日、喜庆纪念日和弹窗。我设计的逻辑非常的简单:

1、顶部条幅和弹窗都可以独立设置某一天或者某一个日期段自动开启自动关闭,也可以随庄重纪念日和喜庆纪念日设置的某一天或者某一个日期段自动开启自动关闭;

2、庄重纪念日适合抗日战争、重大自然灾害等具有缅怀性质的纪念日,开启即全站灰白,不受当前主题配色影响,可以设置某一天或者某一个日期段自动开启自动关闭;

3、喜庆纪念日适合中秋、国庆、过年等喜庆节日,遵循当前主题配色,可以设置某一天或者某一个日期段自动开启自动关闭;

4、庄重纪念日和喜庆纪念日不可同时开启;

5、顶部条幅与弹窗这2个功能可以和庄重纪念日与喜庆纪念日的其中一个任意搭配。

插件介绍

后台设置:启用插件后,点击设置进入后台设置页面,默认全部关闭。

Anniversary ---TypeRenew/Typecho纪念日、顶部横幅及弹窗插件

1、顶部横幅设置:文案即显示的文字内容,横幅背景颜色和文案文字颜色均可以设置;横幅日期分3个选项,有注释,日期不填代表一直显示;横幅显示时长为0时一直显示,大于0时代表显示几秒后消失;由于顶部横幅并不会遮挡视线,降低网站交互度,所以不再设计首页或是全站显示功能,开启即代表全站显示。

Anniversary ---TypeRenew/Typecho纪念日、顶部横幅及弹窗插件

2、庄重纪念日设置:庄重纪念日开启即全站变灰,优先级高于网站后台设置的主题配色。庄重纪念日列表为空相当于此模块关闭。

Anniversary ---TypeRenew/Typecho纪念日、顶部横幅及弹窗插件

3、喜庆纪念日设置:喜庆纪念日开启不改变现有主题配色,喜庆纪念日列表为空相当于此模块关闭。

Anniversary ---TypeRenew/Typecho纪念日、顶部横幅及弹窗插件

4、弹窗设置:弹窗日期分3个选项,有注释,日期不填代表一直显示;由于弹窗会遮挡视线,降低网站交互度,所以可以设置首页或是全站显示,默认首页显示,同时可以设置1天显示的次数,但是这个次数会随着浏览器cookies清除而重新计算。

Anniversary ---TypeRenew/Typecho纪念日、顶部横幅及弹窗插件

前台演示

仅顶部横幅:

Anniversary ---TypeRenew/Typecho纪念日、顶部横幅及弹窗插件

仅弹窗:

Anniversary ---TypeRenew/Typecho纪念日、顶部横幅及弹窗插件

顶部横幅/庄重纪念日/弹窗组合:

Anniversary ---TypeRenew/Typecho纪念日、顶部横幅及弹窗插件

顶部横幅/喜庆纪念日/弹窗组合:

Anniversary ---TypeRenew/Typecho纪念日、顶部横幅及弹窗插件

插件下载地址

https://wwaza.lanzoup.com/b00jfkwxpg
密码:32qa

希望这个插件大家能够喜欢,有问题评论留言。