利用Hexo + Github Pages搭建的一个个人博客 https://rickyyangrui.github.io/

[rickyyangrui]

在学会了Flask之后，我自己也搭建了几个网站，不过都是在自己本地，别人并不能看到，本想去买个域名，服务器来自己搞，但是穷啊，所以想到了用Hexo + Github Pages
来搭建一个站点，最关键的是：免费，哈哈哈。

由于Hexo上面发表博文实在是太麻烦了，所以我只是学会去部署博客，并没有在上面去维护，修改，发表博文，现在还是想把我的Flask + python做的博客发布在网上。这个就是用做入手教程看看。

系统环境配置

要使用Hexo,需要两个东西，一个是Nodejs,一个是Git,让我们整理下胸前的红领巾开始吧。

安装Node.js 和 Git

学习Node.js

学习git

安装Hexo

$ cd d:/hexo
$ npm install hexo-cli -g
$ hexo init blog
$ cd blog
$ npm install
$ hexo generate
$ hexo server

Note:

• hexo generate(hexo g) 生成静态文件，会在当前目录下生成一个新的叫做public的文件夹
• hexo server (hexo s) 启动本地web服务，用于博客的预览
• hexo deploy (hexo d) 部署播客到远端（比如github, heroku等平台）
• hexo new "postName" #新建文章
• hexo new page "pageName" #新建页面
• hexo n == hexo new
• hexo g == hexo generate
• hexo s == hexo server
• hexo d == hexo deploy

当我们执行了hexo s 之后，打开localhost:4000/，这个时候我们就能看到Hexo内置的一个博客了。

但是内置的博客主题非常的丑，不喜欢怎么办，github上早就有人做好了主题，我们直接搜了拿来用就好了。

Hexo主题设置

安装主题

$ hexi clean
$ git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

启动主题

找到Hexo目录下的_config.yml配置文件，然后找到theme属性，将其设置为yilia。

theme：yilia

更新主题

$ cd themes/yilia
$ git pull
$ hexo g # 生成
$ hexo s # 启动本地web服务器

见证奇迹了，打开localhost：4000/ 你就会看到主题已经变了，是不是很开心，但是只能你自己看到，现在我们要做的就是让大家都能看到，let's do it

Github Pages设置

什么是Github Pages

GitHub Pages 本用于介绍托管在GitHub的项目，不过，由于他的空间免费稳定，用来做搭建一个博客再好不过了。

每个帐号只能有一个仓库来存放个人主页，而且仓库的名字必须是username/http://username.github.io，这是特殊的命名约定。你可以通过http://username.github.io 来访问你的个人主页。

这里特别提醒一下，需要注意的个人主页的网站内容是在master分支下的。

GitHub上建立仓库

这里需要注意的是仓库的名字必须按照这个规则来：username/http://username.github.io

部署Hexo到Github Pages

在部署前，先讲下原理：

• 之前步骤中在Github上创建的那个特别的repo（http://rickyyangrui.github.io）一个最大的特点就是其master中的html静态文件，可以通过链接My Blog来直接访问。
• Hexo -g 会生成一个静态网站（第一次会生成一个public目录），这个静态文件可以直接访问。
• 需要将hexo生成的静态网站，提交(git commit)到github上。

Hexo教程：https://hexo.io/docs/deployment.html

• 需要在配置文件_config.xml中作如下修改：

deploy:
  type: git
  repo: git@github.com:rickyyangrui/rickyyangrui.github.io.git
  branch: master

部署前先安装一个扩展：

$ npm install hexo-deployer-git --save

执行命令：

hexo d

使用git命令进行部署

clone github repo

$ cd d:/hexo/blog
$ git clone https://github.com/rickyyangrui/rickyyangrui.github.io.git .deploy/rickyyangrui.github.io

解释：将我们之前创建的repo克隆到本地，新建一个目录叫做.deploy用于存放克隆的代码。

创建一个deploy脚本文件

hexo generate
cp -R public/* .deploy/rickyyangrui.github.io
cd .deploy/rickyyangrui.github.io
git add .
git commit -m “update”
git push origin master

解释：
hexo generate生成public文件夹下的新内容，然后将其拷贝至http://rickyyangrui.github.io的git目录下，然后使用git commit命令提交代码到http://rickyyangrui.github.io这个repo的master branch上。

需要部署的时候，执行这段脚本就可以了（比如可以将其保存为deploy.sh）。执行过程中可能需要让你输入Github账户的用户名及密码，按照提示操作即可。

hexo 主题配置

每个不同的主题会需要不同的配置，主题配置文件在主题目录下的_config.yml。
以我们使用的yilia主题为例，其提供如下的配置项（theme\yilia_config.yml）：

# Header
menu:
  主页: /
  所有文章: /archives
  # 随笔: /tags/随笔

# SubNav
subnav:
  github: "#"
  weibo: "#"
  rss: "#"
  zhihu: "#"
  #douban: "#"
  #mail: "#"
  #facebook: "#"
  #google: "#"
  #twitter: "#"
  #linkedin: "#"

rss: /atom.xml

# Content
excerpt_link: more
fancybox: true
mathjax: true

# Miscellaneous
google_analytics: ''
favicon: /favicon.png

#你的头像url
avatar: ""
#是否开启分享
share: true
#是否开启多说评论，填写你在多说申请的项目名称 duoshuo: duoshuo-key
#若使用disqus，请在博客config文件中填写disqus_shortname，并关闭多说评论
duoshuo: true
#是否开启云标签
tagcloud: true

#是否开启友情链接
#不开启——
#friends: false

#是否开启“关于我”。
#不开启——
#aboutme: false
#开启——
aboutme: 我是谁，我从哪里来，我到哪里去？我就是我，是颜色不一样的吃货…

好了，功成身退，深藏功与名，各位，enjoy it.

在知乎上找到一个好的教程

部署博客以及更新博文

Hexo主题

主题
主题2