自定义hexo博客melody主题标签页title

前言

起初折腾hexo博客采用的主题是nexT,版本是5.1.4,各种第三方插件安装完成之时,有两个bug无法根除:

  • 搜索功能用的是local search,存在点击搜索按钮时,会自动打开一个空的新网页的问题,F12查看网页源码发现问题所在:hexo g命令自动生成的html代码有误,如下
    bug1

  • 博客首页的文章翻页icon无法正常显示,怀疑是fontawsome版本迭代的问题,如下图
    bug2

一开始想通过修改nexT源码来自己修复这两个bug,但在翻了其layout布局源码后,发现无从下手。期间翻看过别人的博客,同为nexT主题,版本不同,没有出现以上问题,于是想到或许可以通过升级nexT版本解决,无奈nexT主题大版本之间差异较大,不想再花时间折腾了。

2月16号更新,在查看melody主题github issues的时候,无意间找到了第二个问题的解决办法,[翻页的地方显示不正常,有html代码](<https://github.com/Molunerfinn/hexo-theme-melody/issues/234 >),记录一下。

虽然整个博客的功能都是正常可用的(能正常搜索,点击图标html能正常上下翻页),但还是没办法容忍这俩瑕疵,于是将博客主题换为更加小众的melody主题。

问题

hexo博客的根配置文件_config.yml有title和subtitle两项,两项都填写后,发现博客首页标签页标题变成了subtitle | title的样式,由于习惯了首页是自己的博客名字,即单纯的title,不包含subtitle,于是想要自定义一番,生命在于折腾嘛。琢磨了一下,发现melody主题的layout布局源码还是比较通俗易懂的,修改方法如下

  1. 定位到hexo博客的根目录,找到layout.pug文件
    Step1

  2. layout.pug文件源码如下,可以看出代码逻辑为:

    • 文章标题page.title优先级大于根配置文件子标题config.subtitle;
    • 中间if语句定义不同页面的标题;
    • 最后为三元运算符,如果pageTitle不为空,后面追加上根配置文件标题config.title,若为空,则pageTitle直接等于config.title。

    Step2

  3. 根据以上分析,不难得到解决方法,只要删去|config.subtitle部分,即可使博客首页标签页标题为博客名(建议先复制原语句备份,然后注释,最后再进行修改)
    Step3

总结

melody主题已经集成了非常多的功能,但一些细节并没有直接提供配置项来修改,这时候如果想要进行博客的私人定制化,则可以通过修改源代码的方式来达成目标。

发布了15 篇原创文章 · 获赞 0 · 访问量 228

猜你喜欢

转载自blog.csdn.net/qq_40151840/article/details/104384875
今日推荐