【Hexo】NexT 6.0+ 配置文件解释、插件安装心得
更新:2019 年 1 月 10 日
# 前言
我的博客(至 2018 年 11 月 29 日为止)一直使用的 Hexo 框架,最近又换回了 NexT主题
,NexT 是 Hexo 里,很有名的一款主题,很多教 如何部署Hexo
的教程都讲到这款主题,也有很多大佬的博客在使用这款主题。
在使用了这款主题后,我浏览了很多关于这款主题的有关美化、插件的教程,都没能完整满足我的需求,这些教程中也包括了NexT 使用文档
(opens new window),当然这里面已经覆盖我大部分想要的答案,或许是内容还没有更新,以至于出现了我在「Hexo 部署遇到的问题与解决方法」讲到的一些 NexT 6.0 无效配置问题。NexT 在 配置文件
中内置了很多默认是 关闭(false)
的功能及插件,大部分在NexT 使用文档
(opens new window)中有讲到,有一些是没有的,当然 配置文件
中基本都是有英文注释解释的,而对于我这种英文盲来讲,还是需要翻译一下才能领会,有些还需要 Google 下,为此写这篇文章,给大家也给自己翻译、介绍下 NexT 配置文件中的一些 “隐藏”功能
。
我默认认为你和我一样, 已成功
搭建 Hexo
并下载使用着 NexT主题
(如果没有,网上有很多教程,内容基本覆盖了搭建到安装 NexT 主题的知识点,NexT6.0 可能会遇到跟教程不一样的操作,可以参考我的「Hexo 部署遇到的问题与解决方法」。
# 设置侧边栏的联系方式(超链接)和图标配置
下面是我当前的配置文件,其中有些默认的联系方式我是没有的,或是暂时不想设置的,不想显示的你可以在代码前 #注释掉,也可以直接删掉。
social:
GitHub: https://github.com/NipGeihou || github
E-Mail: mailto:[email protected] || envelope
Weibo: https://weibo.com/2643914060 || weibo
#Google: https://plus.google.com/yourname || google
#Twitter: https://twitter.com/yourname || twitter
#FB Page: https://www.facebook.com/yourname || facebook
#VK Group: https://vk.com/yourname || vk
#StackOverflow: https://stackoverflow.com/yourname || stack-overflow
#YouTube: https://youtube.com/yourname || youtube
#Instagram: https://instagram.com/yourname || instagram
#Skype: skype:yourname?call|chat || skype
File Browser: http://youku.nipgeihou.com:888 || cloud
phpMyAdmin: http://youku.nipgeihou.com:82 || database
# 添加
除了 E-Mail
等一些特殊联系方式外,其他普通超链接以这种格式添加 注意:之间的空格
:
显示名称 : 超链接 || 图标名
如:
phpMyAdmin: http://youku.nipgeihou.com:82 || database
其中后面的图标名,Nxet 使用的是「Font Awesome」 (opens new window)的图标库,有部分是收费的,在搜索时出现的 浅色图标
就是 收费
的,你在搜索的时候可以点击左侧的 free
来筛选 免费
的图标,找到合适的图标后,复制图标下方的名字,到上面讲到的 图标名
位置即可。如我的 PhpMyAdmin 网址,我就找了一个 database
的图标。
# 设置代码块颜色主题、代码块无法高亮问题
共用 5 款主题: normal
| night
| night eighties
| night blue
| night bright
highlight_theme: night
截图来源:主题配置 - NexT 使用文档 (opens new window)
设置好你喜欢的颜色主题后,发现写文章时使用 代码块
的时候,并 不能高亮代码
,如:
public class HelloWorld
{
public static void main(String[] args)
{
System.out.println( "Hello, World!" );
}
}
高亮代码块,需要在上方 ``` 后面声明语言,如:java.
声明之后效果:
public class HelloWorld
{
public static void main(String[] args)
{
System.out.println( "Hello, World!" );
}
}
常见声明类型:java、bash(linux)、yaml、...
# 关于样式
Hexo 说白了就是生成伪动态网页,真正的动态网页应该是你向服务器发送请求的时候,服务器通过你发送的请求,实时生成返回一个网页,而 Hexo 则是将所有能访问的网页,批量生成了静态网页。
至于样式,Next 默认使用的是外链 CSS,当然你可以编辑 next\source\css
里的 main.styl
,覆盖大部分的原有样式,当然 css 文件夹里不止 main.styl
一个文件,具体需要添加覆盖在那个文件里,则善用 F12 定位元素,查看引用的 CSS 文件,如 main.css?v=6.5.0
对应的就是 main.styl
,以此类推。