Hexo搭建教程

前言

主要记录一下搭建这个博客的全过程,同时把自己在搭建过程中遇到的一些东西也记录下来,作为以后的参考。

一、选择GitHub Pages

选择原因

  1. github pages有300M免费空间,自己管理资料比较可靠;
  2. 学习使用github,为自己的学习打下基础;
  3. 最主要是看上去逼格高啊!!!

    GitHub Pages是什么?

    GitHub Pages本用于介绍托管在GitHub的项目,不过大牛们还是想出了很多利用其空间的方法,于是就有了类似Hexo这样的程序。

    二、安装需要的软件

    需要的软件主要有两个

  4. Git 下载地址:http://git-scm.com/
  5. Node.js 下载地址:http://nodejs.org/

    三、配置SSH key

    由于使用的不是github desktop,为了使本地git项目与远程的github建立联系,我们需要配置SSH Keys。

    (一)检查SSH key的设置

    首先检查你电脑上现有的ssh key:
    1
    $ cd ~/. ssh //检查本机的ssh密钥

如果提示:No such file or directory 说明你是第一次使用git。

(二)生成新的SSH Key:

1
2
3
$ ssh-keygen -t rsa -C "邮件地址@youremail.com"
Generating public/private rsa key pair.
Enter file in which to save the key (/Users/your_user_directory/.ssh/id_rsa):<回车就好>

注意事项:

  1. “邮件地址@youremail.com”请替换成自己注册github时使用的邮箱
  2. 此处的「-C」的是大写的「C」
    然后系统会要你输入密码:
    1
    2
    Enter passphrase (empty for no passphrase):<输入加密串>
    Enter same passphrase again:<再次输入加密串>

在回车中会提示你输入一个密码,这个密码会在你提交项目时使用,如果为空的话提交项目时则不用输入。这个设置是防止别人往你的项目里提交内容。
注意:输入密码的时候没有*字样的,你直接输入就可以了。
看到如下界面,就成功设置ssh key了:
ssh key

(三)添加SSH Key到GitHub

在本机设置SSH Key之后,需要添加到GitHub上,以完成SSH链接的设置。

  1. 打开本地X:\Users\Administrator.ssh\id_rsa.pub文件。此文件里面内容为刚才生成人密钥。如果看不到这个文件,你需要设置显示隐藏文件。准确的复制这个文件的内容,才能保证设置的成功。
  2. 登陆github系统。点击右上角的 Account Settings—>SSH Public keys —> add another public keys。
  3. 把你本地生成的密钥复制到里面(key文本框中), 点击 add key 就ok了。
    ###4、测试SSH Key是否生效
    可以输入下面的命令,看看设置是否成功,git@github.com的部分不要修改:
    1
    $ ssh -T git@github.com

如果得到如下反馈:

1
2
3
The authenticity of host 'github.com (207.97.227.239)' can't be established.
RSA key fingerprint is 16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48.
Are you sure you want to continue connecting (yes/no)?

请输入yes,之后会看到:

1
Hi cnfeat! You've successfully authenticated, but GitHub does not provide shell access.

(四)设置Github用户信息

现在你已经可以通过SSH链接到GitHub了,还有一些个人信息需要完善的。
Git会根据用户的名字和邮箱来记录提交。GitHub也是用这些信息来做权限的处理,输入下面的代码进行个人信息的设置,把名称和邮箱替换成你自己的。

1
2
$ git config --global user.name "username" //替换为自己的用户名
$ git config --global user.email "username@youmail.com" //替换为自己的邮箱

至此,SSH Key配置成功。

四、使用GitHub Pages建立博客

与GitHub建立好链接之后,就可以方便的使用它提供的Pages服务,GitHub Pages分两种,一种是你的GitHub用户名建立的username.github.io这样的用户&组织页(站),另一种是依附项目的pages。
想建立个人博客是用的第一种,形如cnfeat.github.io这样的可访问的站,每个用户名下面只能建立一个。

在Github上建立仓库

登录后系统,在github首页,点击页面右下角「New Repository」
填写项目信息:
project name:zhcx.github.io
description: Simple Note
注意:Github Pages的Repository名字是特定的,比如我Github账号是zhcx,那么我Github Pages Repository名字就是zhcx.github.io。
最后点击「Create Repository」完成创建。

五、本地搭建hexo框架、配置主题

Hexo

(一)Hexo简介

Hexo 是一个轻量的静态博客框架。通过Hexo可以快速生成一个静态博客框架,仅需要几条命令就可以完成,相当方便。而架设Hexo的环境更简单了 不需要 lnmp/lamp/XAMPP 这些繁琐复杂的环境仅仅需要一个简单的http服务器即可使用,或者使用互联网上免费的页面托管服务。

(二)Hexo安装

参考官网中文文档,请尝试者仔细读教程和官方文档。这步很简单,正如官方网站写的那样只需要一条命令即可自动安装hexo框架。

1
$ npm install -g hexo-cli #使用npm安装 Hexo。

初始化hexo

在自己需要的位置建立文件夹,如zhcx.github.io,进入文件夹后右键点击Git bash Here,输入

1
$ npm install

完成后,指定文件夹的目录如下:
.
├── _config.yml
├── package.json
├── scaffolds
├── source
| ├── _drafts
| └── _posts
└── themes

(三)Hexo部署方法

启动本地服务器测试

1
$ hexo s #启动本地服务器测试

这个时候在浏览器中输入http://localhost:4000端口可以看到静态网站架设完成。
具体程序的设置、主题的修改参考官方文档

六、将Hexo部署到Github

首先,你需要为自己配置身份信息,打开命令行,然后输入:

1
2
git config --global user.name "yourname"
git config --global user.email "youremail"

同样在_config.yml文件中,找到Deployment,然后按照如下修改:

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

注意:记得将yourname修改为自己的github用户名
如果使用git方式进行部署,执行

1
npm install hexo-deployer-git --save

来安装所需的插件
最后在当前目录打开命令行,输入:

1
hexo d

将Hexo程序部署到Github上,然后就可以通过yourname.github.io访问了。

七、Hexo使用

打开Hexo目录下的source文件夹,所有的文章都会以md形式保存在_post文件夹中,只要在_post文件夹中新建md类型的文档,就能在执行hexo g的时候被渲染。
新建的文章头需要添加一些yml信息,如下所示:

1
2
3
4
5
6
---
title: hello-world //在此处添加你的标题。
date: 2016-1-12 00:00:00 //在此处输入你编辑这篇文章的时间。
categories: Test //在此处输入这篇文章的分类。
toc: true //在此处设定是否开启目录,需要主题支持。
---

更换主题

可以在官方网站寻找自己喜欢的主题
下载所有的主题文件,保存到Hexo目录下的themes文件夹下。然后在_config.yml文件中修改:

1
2
3
4
# Extensions
## Plugins: http://hexo.io/plugins/
## Themes: http://hexo.io/themes/
theme: landscape //themes文件夹中对应文件夹的名称

更换主题后先执行hexo clean,然后重新hexo g,并且hexo d,很快就能看到新主题的效果了~

八、Github Pages域名绑定

在自己本地的hexo目录下的source文件夹中,新建一个CNAME文件(注意,没有后缀名。),内容为yourdomin.xxx。然后再执行一下hexo d -g,重新上传自己的博客。
在github中打开你自己的库,进入库的setting界面,如果看到了如下提示,说明配置成功了。
域名设置
之后在自己的域名管理界面中添加A记录或CNAME记录

  1. 添加A记录绑定IP为192.30.252.153192.30.252.154
  2. 添加CNAME记录则直接绑定至yourname.github.io
分享到 评论