效果可見 https://chungzh.cn

大家好归斤，我是ChungZH嚷节。今天我們來自己搭建一個(gè)基于Hexo的博客網(wǎng)站吞鸭。

前言

最近有小伙伴問我的博客是怎么搭建的俊扳，想自己做一個(gè)博客網(wǎng)站远寸。為了讓小伙伴們都能自己做一個(gè)網(wǎng)站抄淑，于是我便把我的建站過程寫下來，供大家學(xué)習(xí)驰后。

TRY

Hexo

Hexo 是一個(gè)快速肆资、簡潔且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章灶芝，在幾秒內(nèi)郑原，即可利用靚麗的主題生成靜態(tài)網(wǎng)頁。

配置環(huán)境

安裝Hexo前夜涕，要先安裝幾個(gè)程序犯犁。(安裝方法自行查找，本文不再贅述)

• Node.js
• Git

開始安裝

打開終端女器，輸入以下內(nèi)容：

$ npm install -g hexo-cli

建站

安裝完 Hexo 后酸役，就可以正式開始建站了。

在終端中輸入以下內(nèi)容：

$ mkdir Hexo
$ hexo init Hexo
$ cd Hexo
$ npm install

其中，Hexo 是文件夾的名字簇捍，可以修改只壳。

預(yù)覽

在終端中輸入：hexo server

直到出現(xiàn)INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.的時(shí)候，在瀏覽器中打開localhost:4000即可看到網(wǎng)站暑塑。

（關(guān)于hexo server命令吼句，可以到Hexo官網(wǎng)學(xué)習(xí)，本文不再贅述)

注意：新建文章等可以前往Hexo官網(wǎng)學(xué)習(xí)事格。

配置

經(jīng)過上一步之后惕艳，網(wǎng)站其實(shí)就已經(jīng)搭建好了。不過為了讓網(wǎng)站更好驹愚，我們還是配置一下 Hexo 吧远搪。

安裝NexT主題

在終端中輸入以下內(nèi)容：

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

配置Hexo

用編輯器打開Hexo目錄下的_config.yml，找到并修改以下內(nèi)容：

# Site
title: Hexo         # 此處改為你站點(diǎn)的標(biāo)題
subtitle:           # 此處改為你站點(diǎn)的副標(biāo)題
description:        # 此處改為你站點(diǎn)的說明
keywords:           # 此處改為你站點(diǎn)的關(guān)鍵字
author: John Doe    # 此處改為你的名字
language:           # 此處改為 zh-CN
timezone:           # 此處改為 Asia/Shanghai


# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
root: /
permalink: :year/:month/:day/:title/   # 此處可以改為 :title/
permalink_defaults:



# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: landscape   # 此處改為 next

修改完之后逢捺，再次在終端中輸入：hexo clean && hexo server谁鳍，然后在瀏覽器中打開localhost:4000，即可出現(xiàn)以下效果：

[圖片上傳失敗...(image-f1796f-1534227827725)]

是不是很好看呢~

好了劫瞳，我們繼續(xù)配置倘潜。

配置Next

推薦前往iissnan的網(wǎng)站學(xué)習(xí)。如有不成功的志于，可在評論區(qū)留言涮因。我會(huì)盡力解答。

上傳至Coding Pages

首先伺绽，在Coding網(wǎng)站注冊一個(gè)賬號养泡，同時(shí)在騰訊云注冊一個(gè)賬號。

然后打開Coding網(wǎng)站主頁奈应，點(diǎn)擊左上角的購買按鈕澜掩，出現(xiàn)如下界面：

[圖片上傳失敗...(image-8bc6b7-1534227827725)]

點(diǎn)擊銀牌會(huì)員下面的馬上升級，就會(huì)跳轉(zhuǎn)到綁定頁面钥组。在這個(gè)頁面里綁定你的騰訊云賬號即可输硝。

注意：Windows用戶請打開git終端，接下來的部分全部都需要使用git程梦。要想打開git終端，在桌面點(diǎn)擊右鍵橘荠，然后點(diǎn)擊git bash here即可屿附。

配置ssh

打開終端輸入 ssh-keygen -t rsa -C "your_email@example.com"( 你的郵箱)，連續(xù)點(diǎn)擊 Enter 鍵即可哥童。

ssh-keygen -t rsa -b 4096 -C "your_email@example.com"
# Creates a new ssh key, using the provided email as a label
# Generating public/private rsa key pair.
Enter file in which to save the key (/Users/you/.ssh/id_rsa): [Press enter]  // 推薦使用默認(rèn)地址
Enter passphrase (empty for no passphrase):   //此處點(diǎn)擊 Enter 鍵即可挺份，也可以填寫密碼，填寫密碼后每次使用 SSH 方式推送代碼時(shí)都會(huì)要求輸入密碼贮懈，由于這個(gè) Key 也不是用于軍事目的匀泊，所以也無需設(shè)置密碼优训。

成功之后顯示如下信息：

Your identification has been saved in /Users/you/.ssh/id_rsa.
# Your public key has been saved in /Users/you/.ssh/id_rsa.pub.
# The key fingerprint is:
# 01:0f:f4:3b:ca:85:d6:17:a1:7d:f0:68:9d:f0:a2:db your_email@example.com

添加公鑰

1. 如果是Linux，在終端輸入 open ~/.ssh各聘，用文本編輯器打開id_rsa.pub文件揣非，復(fù)制全部內(nèi)容。如果是Windows躲因，那么請打開C:\Users早敬，然后打開用你的賬戶名命名的文件夾。然后打開里面的.ssh文件夾大脉，再用記事本打開id_rsa.pub文件搞监，復(fù)制全部內(nèi)容。
2. 登錄 Coding.net镰矿，進(jìn)入『SSH 公鑰』頁面琐驴，點(diǎn)擊『新增公鑰』
3. 將第一步中復(fù)制的內(nèi)容填寫到『公鑰內(nèi)容』一欄，公鑰名稱可隨意填寫
4. 設(shè)定公鑰有效期秤标，可選擇具體日期或設(shè)置永久有效
5. 點(diǎn)擊『添加』绝淡，然后輸入賬戶密碼即可成功添加公鑰
6. 完成后在命令行測試ssh -T git@git.coding.net，首次建立鏈接會(huì)要求信任主機(jī)

創(chuàng)建項(xiàng)目

1. 新建一個(gè)名為 {user_name}.coding.me 的項(xiàng)目抛杨。{user_name} 指您本人的用戶名（非昵稱）够委，使用其他人的用戶名創(chuàng)建的項(xiàng)目不會(huì)被歸為『用戶 Pages』類型。
2. 在項(xiàng)目里點(diǎn)擊『代碼 -> Pages 服務(wù)』怖现，選擇『靜態(tài) Pages』 選項(xiàng)卡茁帽，選擇部署來源，點(diǎn)擊『保存』屈嗤。

創(chuàng)建完項(xiàng)目之后潘拨，打開你的項(xiàng)目的主頁，找到如下界面：

[圖片上傳失敗...(image-28d48-1534227827725)]

點(diǎn)擊寫有HTTPS字樣的下拉框饶号，找到SSH并點(diǎn)擊铁追。再復(fù)制右邊的鏈接。

然后打開HEXO的_config.yml文件茫船，找到deploy：

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: 

并將它修改成如下

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: 
    coding: 你剛剛復(fù)制的那個(gè)鏈接

然后在終端中輸入hexo deploy -g琅束，你的網(wǎng)站就上傳到Coding了。

去除廣告

在next主題的_config.yml中找到

  #custom_text: Hosted by <a target="_blank" >GitHub Pages</a>

改為

  custom_text: Hosted by <a target="_blank" rel="external nofollow" ><b>Coding Pages</b></a>

然后打開coding的官方文檔算谈，按照步驟進(jìn)行配置即可篮迎。

綁定自己的域名

詳見官方文檔

做完之后惫撰，網(wǎng)站就建立完畢了淳梦！

這是我的個(gè)人博客網(wǎng)站顶籽，歡迎大家前往參觀：https://chungzh.cn

作者： ChungZH

特別鳴謝：成都-馬龍