给基于Hexo+GitHub搭建的博客下载并安装NexT主题后,发现自己博客呈现的效果跟主题的预览网站好像哪里不太一样。
看了一下文档,发现还是要自己修改主题的配置文件,根据自己喜好来手动设置才成。于是得鹿自己动手丰衣足食,根据NexT的设置文档,给博客进行了个性化设置。
先看个设置前后的对比:
打开博客目录下的themes/next/_config.yml文件,所有的设置都是修改这个文件的内容。
整体风格有四种可选,默认是Muse,也就是上面个性化设置前的样子,侧边栏隐藏款。
可以通过加#注释掉其他scheme行,只留下想尝试的样式,来每种样式都试验一下看看效果。最后我选择了Gemini,它侧边栏不隐藏,每篇文章之间分隔明显。
此外,还可以设置是否启用夜间模式。如果启用,将darkmode设置成true即可。
# Schemes
# scheme: Muse
# scheme: Mist
# scheme: Pisces
scheme: Gemini
# Dark Mode
darkmode: true
博客tab页等地方的logo也支持个性化。
可以将自己的logo放在themes/next/source/images文件夹下,然后更改下面设置,把favicon-16x16-next.png的名字换成你logo图片的名字即可。
favicon:
small: /images/favicon-16x16-next.png
medium: /images/favicon-32x32-next.png
apple_touch_icon: /images/apple-touch-icon-next.png
safari_pinned_tab: /images/logo.svg
默认menu是不显示的,我们可以通过对menu下面的home等去掉注释,来显示menu。想要显示哪些,就去掉哪行注释。
比如,去掉了home和archives行前面的注释,menu就显示了这两项。
menu:
home: / || fa fa-home
#about: /about/ || fa fa-user
#tags: /tags/ || fa fa-tags
#categories: /categories/ || fa fa-th
Hexo搭建与使用: /Hexo搭建与使用 || fa fa-home
archives: /archives/ || fa fa-archive
#schedule: /schedule/ || fa fa-calendar
#sitemap: /sitemap.xml || fa fa-sitemap
#commonweal: /404/ || fa fa-heartbeat
除了home和archives之外,menu下其他所有的选项,都需要手动创建。
例如,想要创建 "categories"页面,则需要在终端中执行下面代码,其中Blogs是我的博客根目录:
$ cd Blogs
$ hexo new page categories
执行成功后,在Blogs/source/下会创建一个名为categories的文件夹,打开文件夹中的index.md文件,添加type属性:
title: categories
date: 2024-02-01 17:32:34
type: categories
然后把menu下的下面语句取消注释。
categories: /categories/ || fa fa-th
此时,menu下就出现了categories。那么categories下的分类该怎么设置呢?
这需要我们在写文章的时候指定文章分类。
title: 个性化设置Hexo博客的NexT主题
date: 2024-02-01 10:51:56
tags: [Hexo, NexT]
categories:
- [Hexo搭建与使用]
点击menu下的categories,就会出现分类页面,它会自动将文章分类。
在archives页面的最上面,有行很烦的提示"Um…! 3 posts in total. Keep on posting.",按照下面步骤可以将它隐藏。
首先在【博客根目录/source/】下新建一个名为_data的文件夹,在_data下新建styles.styl文件。然后把下面代码粘贴进新建的文件里,保存。
.archive .collection-title {
display: none !important;
}
找到【博客根目录/themes/next/_config.yml】文件,将custom_file_path下这行代码的注释取消,就可以隐藏这行提示了。
style: source/_data/styles.styl
在每个页面,会显示多篇文章,可以设置文章是显示全文还是只显示一部分内容。参考下图,可以看到两种显示方式的区别。
如果要只显示摘要,就在博文的md文件中想要隐藏的内容上方,添加。
到现在为止,我的博客菜单栏还是英语,扔然可以通过设置Blogs/themes/next/_config.yml中的language修改语言为中文:将en修改为zh-CN即可。
此外,还可以在这里设置自己的博客名称、简介以及作者等。
# Site
title: 林间得鹿
subtitle: ''
description: '林间得鹿的博客'
keywords:
author: 林间得鹿
language: en
timezone: ''