点击查看更新记录
更新记录
2021-02-07:正式版v4.0
点击查看参考教程
参考方向 | 教程原贴 |
---|---|
冰老师原教程 | 教程:基于Butterfly主题的模拟电子钟侧边栏小部件3.0版 |
天气API | openweathermap |
由于本教程涉及的所有修改对缩进格式等有严格要求,担心自己控制不好的可以直接下载静态资源。参照教程进行修改。静态资源包内的index.pug为butterfly_v3.5.1版本。其他版本改法详见教程正文。
预览效果
本帖基于Butterfly_v3.6.2
进行编写,对于低版本,在index.pug
的写法上可能存在差异,请读者根据自己的版本自行修改。
点击查看魔改正文
将下载的静态资源包内的文件夹放到目录下,即。
新建,
新建,
新建,记得更改的值为你之前获取的密钥,
修改,添加依赖项:
修改
#aside_content.aside_content
if theme.aside.card_author.enable
include ./card_author.pug
.sticky_layout
+ include ./card_clock.pug
if theme.aside.card_announcement.enable
include ./card_announcement.pug
if theme.aside.card_recent_post.enable
include ./card_recent_post.pug
if theme.newest_comments.enable
include ./card_newest_comment.pug
if theme.ad && theme.ad.aside
此处写法是在站点页和文章页都添加了card_clock
,只需要文章页有的就只写上面这个。只需要站点页有的就只写下面这个。
#aside_content.aside_content
if theme.aside.card_author.enable
!=partial('includes/widget/card_author', {}, {cache:theme.fragment_cache})
if theme.aside.card_announcement.enable
!=partial('includes/widget/card_announcement', {}, {cache:theme.fragment_cache})
.sticky_layout
if is_post()
if showToc
include ./card_post_toc.pug
+ !=partial('includes/widget/card_clock', {}, {cache:theme.fragment_cache})
if theme.aside.card_recent_post.enable
!=partial('includes/widget/card_recent_post', {}, {cache:theme.fragment_cache})
if theme.ad && theme.ad.aside
!=partial('includes/widget/card_ad', {}, {cache:theme.fragment_cache})
else
+ !=partial('includes/widget/card_clock', {}, {cache:theme.fragment_cache})
if theme.aside.card_recent_post.enable
!=partial('includes/widget/card_recent_post', {}, {cache:theme.fragment_cache})
if theme.ad && theme.ad.aside
!=partial('includes/widget/card_ad', {}, {cache:theme.fragment_cache})
if theme.newest_comments.enable
!=partial('includes/widget/card_newest_comment', {}, {cache:theme.fragment_cache})
if theme.aside.card_categories.enable
!=partial('includes/widget/card_categories', {}, {cache:theme.fragment_cache})
if theme.aside.card_tags.enable
!=partial('includes/widget/card_tags', {}, {cache:theme.fragment_cache})
if theme.aside.card_archives.enable
!=partial('includes/widget/card_archives', {}, {cache:theme.fragment_cache})
if theme.aside.card_webinfo.enable
!=partial('includes/widget/card_webinfo', {}, {cache:theme.fragment_cache})
此处写法是在站点页和文章页都添加了card_clock,只需要文章页有的就只写上面这个。只需要站点页有的就只写下面这个。
#aside_content.aside_content
//- post
if is_post()
if showToc && theme.toc.style_simple
.sticky_layout
include ./card_post_toc.pug
else
!=partial('includes/widget/card_author', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_announcement', {}, {cache:theme.fragment_cache})
.sticky_layout
if showToc
include ./card_post_toc.pug
+ !=partial('includes/widget/card_clock', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_recent_post', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_ad', {}, {cache:theme.fragment_cache})
else
//- page
!=partial('includes/widget/card_author', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_announcement', {}, {cache:theme.fragment_cache})
.sticky_layout
+ !=partial('includes/widget/card_clock', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_recent_post', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_ad', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_newest_comment', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_categories', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_tags', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_archives', {}, {cache:theme.fragment_cache})
!=partial('includes/widget/card_webinfo', {}, {cache:theme.fragment_cache})
此处写法是在站点页和文章页都添加了card_clock,只需要文章页有的就只写上面这个。只需要站点页有的就只写下面这个。
#aside_content.aside_content
//- post
if is_post()
if showToc && theme.toc.style_simple
.sticky_layout
include ./card_post_toc.pug
else
!=partial('includes/widget/card_author', {}, {cache: true})
!=partial('includes/widget/card_announcement', {}, {cache: true})
.sticky_layout
if showToc
include ./card_post_toc.pug
+ !=partial('includes/widget/card_clock', {}, {cache: true})
!=partial('includes/widget/card_recent_post', {}, {cache: true})
!=partial('includes/widget/card_ad', {}, {cache: true})
else
//- page
!=partial('includes/widget/card_author', {}, {cache: true})
!=partial('includes/widget/card_announcement', {}, {cache: true})
.sticky_layout
+ !=partial('includes/widget/card_clock', {}, {cache: true})
!=partial('includes/widget/card_recent_post', {}, {cache: true})
!=partial('includes/widget/card_ad', {}, {cache: true})
!=partial('includes/widget/card_newest_comment', {}, {cache: true})
!=partial('includes/widget/card_categories', {}, {cache: true})
!=partial('includes/widget/card_tags', {}, {cache: true})
!=partial('includes/widget/card_archives', {}, {cache: true})
!=partial('includes/widget/card_webinfo', {}, {cache: true})
修改,
去jquery
适配pjax
新增夜间模式
完全重构pug和css,完美自适应