hexo搭建博客-butterfly主题详细版
hexo搭建博客-butterfly主题详细版
Hexo搭建博客-butterfly主题
前置知识
1. 对于Github和Gitee的基本了解与使⽤。最关键的是你要知道github为什么访问的这么慢，如何魔法上⽹访问github。或者说不⽤魔
法如何访问github(本⽂在可能遇到的问题说明了如何访问github)
2. Git的基本使⽤
3. yaml语法
4. nodejs的基本了解，npm，插件什么的（不是要会这个，⼤概知道这是个什么东西即可）
5. 其它的编程基本知识：全局环境变量如何配置，nodejs的npm如何添加国内镜像加速，
建议⼩⽩先去了解⼀下⼀些编程的基本问题。⽐如⽂件名不能⽤空格，yml的语法，全局环境变量如何配置等等。没有⼀点基础直接硬上的话，效率很低，会报各种各样的错误，然后为了解决⼀个⼩问题会浪
费很多时间。
博客环境说明
1. 笔者环境：win10 64位；node.js：10.16.0；Git：
2.22.0
2. 写代码的环境vscode，建议编写yml配置⽂件时⽤vscode。其它的诸如NodePad++会出现各种不知名的问题。
Node.js安装
Git安装
安装Hexo
步骤
⾸先选择⼀个磁盘作为你博客⽂件的存放位置，然后新建⼀个⽂件夹，⽐如名为 Hexo_blog 的⽂件夹（我后⾯的截图名字是Hexo_blog的是我之前的⼀个，名字为myhexo的⽂件夹是我现在正在⽤的）。
创建完后，先不要点进去，在现在的⽬录⿏标右键，选择 Git Bash Here，然后依次输⼊如下命令：
# hexo框架的安装
npm install -g hexo-cli
# 等上⼀个命令完成后，在输⼊下⾯的命令
hexo init <；新建⽂件夹的名称>#初始化⽂件夹
cd<；新建⽂件夹的名称>
npm install# 安装博客所需要的依赖⽂件
1. github被墙
解决⽅法⼀：Github搜Github520项⽬，按照⽂档配置即可，5分钟即可解决。⼀直⽆法访问github的可以去gitee这个项⽬：gitee/doshengl/GitHub520
缺点：有时候可能不太好使
解决⽅法⼆：翻过去，怎么翻不能教，因为wf。不会翻的话就⽼⽼实实⽤第⼀个，这也是没办法的事怎么创建自己的博客
验证是否成功
注意：后续的命令如⽆特殊说明均需要在站点⽬录下（即myhexo内）使⽤ Git Bash 运⾏。等待运⾏完成，此时⽂件夹中多了许多⽂件， 此时 Hexo 框架的本地搭建已经完成了。
我们来运⾏⼀下看看，命令⾏依次输⼊以下命令进⾏本地验证:
hexo g && hexo s
主题配置
1. hexo有各种各样风格的主题，笔者了⼏⼗款，最终选的是这款主题。这款主题的⽂档写的是我见过的所有主题⾥最好的，风格也是
我最喜欢的，并且作者更新频率也很⾼。
2. ⽂档中已经有的部分我不再赘述，⽂档地址：/posts/21cfbf15/。本篇⽂章只补充⽂档⾥没有说的很清楚
的地⽅。
安装
⽂档⾥说的是在你的博客根⽬錄裏，哪⾥是博客根⽬录呢？看图
在你的博客根⽬录，右键git bash here，输⼊⽂档中的命令即可。
运⾏完命令后，最终的效果是
你们这⾥可能有个landscape主题，是hexo的默认主题，就是你localhost:4000看到的那个风格，那个我已经删了，你想删就删不影响。导航菜单
Home: / || fas fa-home
Archives: /archives/ || fas fa-archive
Tags: /tags/ || fas fa-tags
Categories: /categories/ || fas fa-folder-open
List||fas fa-list:
Music: /music/ || fas fa-music
Movie: /movies/ || fas fa-video
Link: /link/ || fas fa-link
About: /about/ || fas fa-heart
1、这⾥要强调的就是yaml的语法，空格缩进。以及这⾥的格式⼀定要严格按照⽂档的格式写，冒号，||这些不能错。
2、如果你想要导航栏是中⽂的，那就直接像我这样写成中⽂就⾏。后⾯的iconfont你不能按照我这样写，我的这⾥图标是⾃定义的，你没有⾃定义就会显⽰不出来效果。关于如何⾃定义图标在后⾯会讲
menu:
⾸页: / || iconfont icon-shouyex
⽂章 || iconfont icon-zuixinwenzhang_huaban:
分类: /categories/ || iconfont icon-fenlei1
标签: /tags/ || iconfont icon-biaoqian1
归档: /archives/ || iconfont icon-shijianzhou
⽣活 || iconfont icon-shenghuo:
留⾔板: /messageboard/ || iconfont icon-liaotian-04
友⼈帐: /link/ || iconfont icon-lianjie
分享: /share/ || iconfont icon-fenxiang
相册: /gallery/ || iconfont icon-xiangce
书籍: /books/ || iconfont icon-shuji
影视: /FilmAndTV/ || iconfont icon-yingshi1
导航站: /daohang/ || iconfont icon-daohang
关于笔者: /about/ || iconfont icon-gerenzhongxin
最终的效果就是
搜索系统

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。