在github上搭建hexo博客

发表于

花了大概一个晚上+各种空闲时间，总算是把博客搭好了。第一篇博客就先记录一下怎么搭其一个hexo博客，给以后像我这样的萌新能更高效地来搭起一个hexo博客<(￣︶￣)>

什么是hexo

hexo就是一个静态的博客页面，虽然是静态的但更新起来也很方便，同时页面不仅简介还很漂亮【这才是重点

搭建hexo博客前的准备

安装node.js

一开始我还以为node.js是一个js的文件而已，用了才知道是用js语法写成的一个运行环境。到node.js官网就能下到（下msi格式的就行），下完安装一直next解决。然后按照自己的安装路径，将node.js添入path的环境变量中，一般是这两个

1
2
C:\Program Files\nodejs\
C:\Users\用户名\AppData\Roaming\npm

安装git

一般都是会把博客放github上的，所以下载要下载git。这个也是去官网找就好。对了，建议把Git Bash放在右键的快捷方式那，这样比较便捷。设置方法【其实百度一下就有

注册github

既然要把博客放上github，自然就要有一个gitHub账号,简单注册一下就好。对了，起名要起好，因为github的博客url是和id一样的（要用自己域名的dalao可以不理这个

建完后要给账号添加本机的SSH，先检查C:\Users\用户名下有没有.ssh目录。有的话找找看有没id_rsa和id_rsa.pub这两个文件，没有的话执行命令

1
ssh-keygen -t rsa -C "youremail@example.com"

一路回车下去，搞定后把id_rsa.pub里的公钥复制出来，在github上打开“Account settings”→“SSH Keys”，点“Add SSH Key”在key里粘贴公钥，title的话随意

搭建hexo博客

下载安装hexo

首先先新建一个文件夹用来放博客，再这个文件夹里打开Git Bash然后输入

1
npm install hexo

如果没出现error并再当前文件夹下出现了一个node_modules文件夹，就算成功了

开启hexo

依次执行以下命令

1
2
3
4
5
6
7
hexo init  --初始化hexo环境,这时会在目录下自动生成hexo的文件

npm install --安装npm依赖包

hexo generate --生成静态页面

hexo server --生成本地服务

在执行hexo init时要注意的是要确保是在一个空文件下执行，否则会报错。

如果出现command not found的话，和node.js一样要把hexo加入环境变量中，一般是这个

1
你的目录\node_modules\hexo\bin;

命令运行完后，打开http://localhost:4000,如果hexo的默认页面就算成功了

将hexo博客发布到github上

先一个和自己用户名（可以从url上看到）一样的仓库，然后在hexo安装的文件夹里对配置文件 _config.yml 进行设置

对最下方deploy进行修改

1
2
3
4
deploy:
  type: git
  repo: git@github.com:yourname/yourname.github.io.git
  branch: master

然后在Git Bash中执行

1
2
3
npm install hexo-deployer-git --save

hexo deploy

执行成功后，就能通过http://yourname.github.io/进入你的博客了(^_^)b

对博客进行一些装饰

这里只写我已经摸出来的orz

修改hexo主题

在 博客所在目录/themes 下执行

1
git clone https://github.com/iissnan/hexo-theme-next

然后在博客的配置文件 _config.yml设置

1
theme: next

修改next的主题

在next的配置文件 _config.yml 中将想要的主题取消注释就好

1
2
3
4
5
# Schemes
# scheme: Muse
scheme: Mist
#scheme: Pisces
#scheme: Gemini

加上这个很炫的动态背景

在next的配置文件中将选项设为开启就行

1
2
# Canvas-nest
canvas_nest: true

加上侧面头像

将头像放置主题目录下的 source/uploads/ （新建 uploads 目录若不存在）
配置为： avatar: /uploads/avatar.png
或者 放置在 source/images/ 目录下
配置为： avatar: /images/avatar.png
（都是在next的配置文件下修改）

篡写文章

先在博客目录下执行

1
hexo new "title"

然后到 source/_post 下就能看到有 title.md,对这个编辑就好。建议使用markdown2进行编辑

添加标签

使用 hexo new page tags 新建一个标签页面

然后在 目录/source/tags 下找到 index.md,将里面的内容修改为

1
2
3
4
5
6
---
title: 标签
date: 2019-01-30 20:38:46
type: "tags"
comment: false
---

然后在编辑文章时，在头部写入标签即可,像这样

1
2
3
4
5
---
title: 在github上搭建hexo博客
tags:
	- hexo
---

参考：
手把手教你使用hexo搭建属于你的个人博客