文章对主题_config.yml与_config.butterfly.yml文件的修改不做记录。若有看不懂的地方，请先认真阅读安装文档后欢迎评论或邮件提问探讨。
介绍
本站使用Hexo框架搭建，主题为Butterfly。
本篇为本博客更改主题文件配置信息，为有需要做相同修改的朋友，或者将来主题更新适配留作说明。
修改首页标题显示
博客首页标题默认显示为_config.yml文件中配置的title项目。
在/themes/butterfly/layout/includes/header/index.pug文件中找到site_title变量赋值处，
1
| - var site_title = page.title || page.tag || page.category || config.title
|
这句话的意思是，该页面显示的标题有优先级，先后取自，文章标题，标签，分类，_config.yml文件title项。
想自定义首页标题，在config.title项前添加theme.blog_name ：
1
| - var site_title = page.title || page.tag || page.category || theme.blog_name || config.title
|
而后去_config.butterfly.yml随意找一处(建议在开头)添加配置项blog_name，本站配置如下，不需要缩进。
修改顶部导航栏搜索图标排序
找到文件/themes/butterfly/layout/includes/header/nav.pug修改将菜单配置移到搜索配置之前，注释掉搜索文字就可以只得到一个搜索按钮，希望保留的可以不注释- span=' '+_p('search.title')
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
| nav#nav
span#blog-info
a(href=url_for('/') title=config.title)
if theme.nav.logo
img.site-icon(src=url_for(theme.nav.logo))
if theme.nav.display_title
span.site-name=config.title
#menus
!=partial('includes/header/menu_item', {}, {cache: true})
if (theme.algolia_search.enable || theme.local_search.enable || theme.docsearch.enable)
#search-button
a.site-page.social-icon.search(href="javascript:void(0);")
i.fas.fa-search.fa-fw
//- span=' '+_p('search.title')
//- !=partial('includes/header/menu_item', {}, {cache: true})
#toggle-menu
a.site-page(href="javascript:void(0);")
i.fas.fa-bars.fa-fw
|
修改侧栏作者卡
找到文件/themes/butterfly/layout/includes/widget/card_author.pug
我将以下代码注释后获得了简洁的卡片内容
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
| if theme.aside.card_author.enable
.card-widget.card-info
.is-center
.avatar-img
img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
.author-info__name= config.author
.author-info__description!= theme.aside.card_author.description || config.description
//- .card-info-data.site-data.is-center
//- a(href=url_for(config.archive_dir) + '/')
//- .headline= _p('aside.articles')
//- .length-num= site.posts.length
//- a(href=url_for(config.tag_dir) + '/')
//- .headline= _p('aside.tags')
//- .length-num= site.tags.length
//- a(href=url_for(config.category_dir) + '/')
//- .headline= _p('aside.categories')
//- .length-num= site.categories.length
if theme.aside.card_author.button.enable
a#card-info-btn(href=theme.aside.card_author.button.link)
i(class=theme.aside.card_author.button.icon)
span=theme.aside.card_author.button.text
if(theme.social)
.card-info-social-icons.is-center
!=partial('includes/header/social', {}, {cache: true})
|
固定导航栏
找到文件/themes/butterfly/source/js/main.js，修改网页滑动逻辑判定,全篇代码太长，仅给出有做修改段代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
|
const scrollTask = btf.throttle(() => {
const currentTop = window.scrollY || document.documentElement.scrollTop
const isDown = scrollDirection(currentTop)
if (currentTop === 0) {
$header.classList.remove('nav-fixed', 'nav-visible')
isChatBtn && window.chatBtn.show()
$rightside.classList.remove('rightside-show')
}
else{
$rightside.classList.add('rightside-show')
isChatBtn && window.chatBtn.hide()
}
isShowPercent && rightsideScrollPercent(currentTop)
if (document.body.scrollHeight <= innerHeight) {
$rightside.classList.add('rightside-show')
}
}, 300)
btf.addEventListenerPjax(window, 'scroll', scrollTask, { passive: true })
}
|
添加个人GitHub贡献度日历
参考博客百里飞洋 Barry-Flynn，感谢大佬解答，以及提供了插件以及后端API维护,请前往其仓库了解详情。
2024年3月29日更新
今天API失效了,GitHub应该添加了请求头,在百里飞洋 Barry-Flynn提供API基础的前提上,我做了修改提交到了我的仓库python_github_calendar_api.有需要的可以自行查看。
设置动态星空背景
参考【Hexo博客】如何使博客拥有星空背景和流星特效
背景图片来源星际穿越壁纸
