Github Pages+Hexo+阿里雲域名綁定

1.Github Pages

Github Pages能夠免費託管，因此把博客託管到github上。

首先，建立一個github倉庫，倉庫的命名格式爲：yourusername.github.io，而後根據提示進行下一步。

2.Hexo搭建博客

本博客中使用了Anisina的主題，因此會詳細介紹下按照Anisina主題搭建的步驟。

1.準備工做

1.首先要安裝下node.js（官網下載）,若是已經安裝能夠跳過。
2.安裝git（官網下載）
3.安裝Hexo：

$ npm install -g hexo複製代碼

安裝成功後，使用version命令查看是否安裝成功

& hexo version複製代碼

4.本地靜態hexo博客

• 新建一個文件夾，做爲你博客文件的根目錄
• 命令行進入該文件夾下,輸入如下命令，生成模板：

$ hexo init複製代碼

• 模板生成後，輸入如下命令：

$ npm install複製代碼

• 最後能夠運行hexo s命令查看是否搭建成功

2.下載主題

git clone https://github.com/Haojen/hexo-theme-Anisina.git themes/Anisina複製代碼

3.配置博客

1.配置博客封面圖

將img的alt屬性設置爲post-cover便可

2.用戶信息配置

注意：必須在主題的_config.yml中配置一下信息，而非博客根目錄下的_config.yml中配置。

user_name: your name
user_avatar: your avatar
user_location: your location
user_description: about you introduction

// this info will show About page
user_contact: 
user_introduction:

// config you share info
weibo_username: 
zhihu_username: 
github_username:
twitter_username: 
facebook_username:  
linkedin_username:複製代碼

3.建立About頁面

在根目錄下的source文件夾裏建立一個about文件夾，而後在about文件夾裏新建index.md文件,在文件中添加以下代碼，並保存：

title: about
date: 2017-09-11 23:12:50
layout: about複製代碼

須要提一下的是，做者尚未支持對About頁面內容的修改，因此本博客搭建的時候，直接在themes/Anisina/layout/about.ejs中修改的內容。

4.建立Works頁面

在根目錄下的source文件夾中建立works文件夾，如上新建一個index.md，添加以下內容到文件中，並保存：

title: My Works
date: 2017-09-11 23:16:50
layout: works複製代碼

而後在source文件夾下建立一個_data文件夾，打開文件夾，新建project.json文件，文件格式以下:

{
  "Apple 官網臨摹": {
    "title": "Apple 官網臨摹",
    "subTitle": "根據美版apple官網臨摹",
    "img_link": "http://o7bkkhiex.bkt.clouddn.com/item-apple.jpg",
    "use" : ["jQuery"],
    "link": "http://haojen.github.io/apple-linmo/",
    "data":"2016.3",
    "direction": "臨摹 2016 年三月份 Apple 美版單頁面。"
  },
   "Anisina (阿尼絲娜)": {
    "title": "Anisina",
    "subTitle": "基於 Hexo 製做的我的博客主題",
    "img_link": "http://o7bkkhiex.bkt.clouddn.com/Anisina.png",
    "use" : ["jQuery","Bootstrap","Node.js","EJS","Hexo","SASS"],
    "link": "http://haojen.github.io/",
    "data": "2016.5",
    "direction":
        "Hexo 是某位臺灣友人基於 Node.js 編寫的博客框架"
  }
}複製代碼

5.添加評論系統

主題中支持來比力的配置，因此在_config.yml配置文件中添加兩行配置代碼便可。

use_livere: true
livere_uid: 你的來比力的註冊uid複製代碼

6.添加百度統計

主題中添加了百度統計的js代碼，在配置文件中直接添加track_id便可:

ba_track_id: your track id複製代碼

7.部署Hexo博客

• 建站

hexo init yourname
cd yourname 
npm install複製代碼

• 配置_config.yml的部署:

deploy:
  type: git
  repo: http://github.com/yousername/yourusername.github.io
  branch: master #默認master複製代碼

• 清除緩存

$ hexo clean複製代碼

• 生成靜態網頁

$ hexo g複製代碼

• 本地查看效果，執行完後能夠經過http://localhost:4000查看本地效果

$ hexo s複製代碼

• 部署到git

$ hexo d複製代碼

3.綁定阿里雲域名

以前在阿里雲買了域名，域名購買成功以後要等待實名認證。

1.添加CNAME文件

在根目錄下的source文件夾下新建CNAME文件，沒有後綴。

在Sublime Text中打開CNAME文件，在裏邊添加你的域名信息，如圖：

保存以後，從新部署到github pages上。

2.給github項目添加

在項目的Settings中，添加Custom domain到本身的域名：

3.給域名添加解析記錄

1.ping你本身的yourname.github.io獲取到ip地址：

2.打開域名的解析列表，添加兩條解析記錄：

更換以後，可能須要等一段時間才能生效，差很少就大功告成啦。