hexo部署成功但是没效果_Hexo博客教程(四)| 换一个炫酷的响应式主题 —— Matery...
发布日期:2021-06-24 13:09:06 浏览次数:2 分类:技术文章

本文共 1709 字,大约阅读时间需要 5 分钟。

点上方蓝字关注我们

每天都有好玩的东西等着你

15066c3ab3d5dccf5cd25b212c5d70a8.png

专栏回顾

▷ Hexo博客详细教程(一)| 建立本地站点

▷ Hexo博客教程(二)| 如何写作新文章并发布

▷ Hexo博客教程(三)| Github、Coding 部署Hexo站点详解

Matery主题

Hexo官方站点( https://hexo.io/themes )上有非常多的主题,可以选择一套自己喜欢的,并且这些主题都是开源的,基本参考readme文档就可以完成更换,如果你懂点前端知识的话,还可以进行修改,贡献代码。

这里我使用的 Matery 主题,是由blinkfox大佬开发的一款的响应式主题,具有以下特色:

  • 首页轮播文章展示及每天动态更换 Banner 图片

  • 瀑布流式的博客文章列表

  • 时间轴式的归档页

  • 词云的标签页和雷达图的分类页

  • 支持在首页的音乐播放和视频播放功能

  • ……

推荐这款主题的原因是因为:

需要的功能它都有,不需要的它也有,很爽

好了,废话不多说,开始更换主题!

1. 下载Metery主题到本地

Hexo的所有主题源代码都是托管在Github的,更换主题第一步:将该主题的源代码clone下来,放到本地Hexo站点根目录下的themes文件夹中

访问Metery主题的Github仓库,复制仓库地址:

https://github.com/blinkfox/hexo-theme-matery

6ceeeaa7f36a992cd0675f8f076388e2.png

然后在本地站点根目录打开git bash 命令行,进入themes文件夹,开始拉取代码到本地:

cd themes git clone https://github.com/blinkfox/hexo-theme-matery.git
be03ac63ad4edbb1495e61c02553556e.png
5e5f2c8c20bf3f997cfd50c3e206eb56.png

因为Hexo的部署是使用git推送的,这里我们不使用git子模块的方式,直接将主题文件的git仓库删除,可以避免很多问题:

5f567842501fe772f32772d810dd8352.png

2. 更换metery主题

下载Hexo的主题到/themes文件夹之后,要在站点配置文件中配置使用该主题:

fb6a87e39f4d4dff80b8df9b58e8e359.png

这样就更换成功啦!清除生成部署三连,看看效果:

hexo clean hexo g hexo d

对于该主题,为了更好的显示效果,建议在站点配置文件中修改如下配置:

  • 修改站点主url:

fb7adc1f6d4eec2c59e4a3c446f4fb82.png
  • 修改每页显示文章数目为6的倍数:

83ff557b95d02d7a6bfb384c537adacc.png

然后就是见证奇迹的时候了,访问站点看一下效果:

ce5c4c43a586d859c23258a51a8f224e.png
0bfa94d98f49eb79d99c02f3db13edce.png

如果碰到主页可以正常访问,但是文章访问不了的情况,应该是最近Metery主题的问题,我的解决方案是,使用命令npm i --save hexo-wordcount安装这个插件,然后重新清除生成部署三连即可。

e8bd14548a28c1c6745c79cad074d2cb.png
7ea7d8dc79bc43e5c7e94c101db13553.png

3. 配置metery主题

对于该主题的自定义配置修改,需要修改主题文件夹中的_config.yml文件,称之为主题配置文件

4331d688987c26ff5cb14d3486ed66be.png

关于这些自定义配置,可以参考作者的文档,我差不多都跟着做了,没问题的,500多行的配置文件,我是真滴没法讲解,望大家谅解^_^:

https://github.com/blinkfox/hexo-theme-matery/blob/develop/README_CN.md

这里我来说说最重要的一点 —— 评论系统

这款主题支持几乎所有主流的评论系统,如图:

15d6e712b98873909f73d792ec498e8a.png

这些评论我都试过来了,最终得出以下经验:

  • gittalk是利用了github的issue功能,加载速度快,评论需要登录,方便管理,只支持Github登录;

  • 来必力界面好看,评论时支持各种账号登录,有邮件通知,缺点是加载超级慢的;

gittalk的效果可以看主题作者的博客:

  • https://blinkfox.github.io/

来必力的效果可以看我的博客效果:

  • http://www.mculover666.cn/

评论系统就从这两个之间选吧,别的可以不用看哈哈~

关于文章永久链接也可以不用修改,后面我会在Hexo进阶教程中讲述如何设置链接为除数字编号,希望大家玩的愉快~

另外,大家如果搭出来,可以在我的博客留言板上留言,我添加友情链接到我的博客上,也欢迎互加友链,谢谢呀!

精选教程 | 精选文章

0a6e89e6dcdc3c6afb42b92b09991b9f.png

(点击图片即可跳转)

更多精彩文章及资源,欢迎关注我的微信公众号:『mculover666』。

286a7552379ad267ceb9f2d405c343df.png

转载地址:https://blog.csdn.net/weixin_33001305/article/details/112096041 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:c++函数不明确_构建和使用Go软件包作为C库
下一篇:android bp文件_[Android]恋恋APK登录协议分析

发表评论

最新留言

很好
[***.229.124.182]2024年04月24日 15时49分42秒