下载Hexo主题,并做相应的配置和优化

教程 专栏收录该内容
23 篇文章 0 订阅

下载主题



期文章教大家如何搭建Hexo,并部署到Github Pages
因为官方给的默认主题太丑了,或不合自己的心意
这期就教大家如何下载主题、设置和优化主题
下载主题可以去Github上搜索主题,也可以去百度搜索Hexo主题下载,我这里以GitHub为例




1. 打开GitHub官网首页,搜索主题,这里我以yilia为例
J3OyFA.png


2. 这里有两个yilia主题,第二个是增强版(也就是别人修改了部分样式和添加了部分插件)
而第一个就是原汁原味的yilia主题了,这里我以原版yilia为例

J3OcWt.png


3. 点击第一个yilia进去后往下滑有教程

J3O5wQ.png


4. 选择右边的绿色按钮下载zip,解压到你hexo的themes文件夹内,这里我使用Git克隆到本地

J3O2SP.png
J3OWy8.png


5. 克隆过后themes文件夹内就有了yilia主题,第一个是默认主题(可删除)

J3OfOS.png


6. 返回到Hexo的目录下打开_config.yml配置文件,往下滑找到theme将原来默认的主题换成yilia,这里方便大参照,我添加了注释

J3OeGq.png
J3OnzV.png

J3OMsU.png
J3OmR0.png
J3OKMT.png



7. 接下来我们打开Git输入hexo g生成静态页面,随后输入hexo s启动Hexo服务

J3OZin.png
J3OAaj.png


8. 打开浏览器在地址栏输入localhost:4000就会发现我们主题已被更换为yilia主题了

J3OEIs.png

配置



9. 点击所有文章,我这里调了颜色,不过上面提示有组件缺失

J3O3dJ.png


10. 在Hexo配置文件下打开Git

J3O1Z4.png


11. 输入npm i hexo-generator-json-content --save后回车,等待安装

J3O8o9.png


12. 在Hexo配置目录下打开_config.yml配置文件输入提示组件缺失的代码,保持并推出,刷新localhost:4000即可

J3OJiR.png


13. 新建一篇文章看看是否有效

J3OtRx.png


14. 按照Git提示的路径打开测试.md

J3OdsO.png


15. 这里我就用我之前文章的开头来测试,保存并退出

J3ODdH.png


16. 接着在Git里输入hexo g生成静态文件,然后输入hexo s启动Hexo服务

J3OwLD.png
J3OBee.png


17. 浏览器重新刷新localhost:4000成功显示出来

J3O4eg.png



最后说明一下:如果文章太长可以用来折叠内容,点击展开全部才会显示全部信息

<!-- more -->



如果觉得不错的话,就分享给你的好朋友

Github

Gitee

  • 0
    点赞
  • 0
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 深蓝海洋 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值