0%

Using Hexo as blog, and deploy to Nginx

Posted on Edited on In

步驟說明

Hexo是款 Node.js 寫的 以Markdown為主的靜態式Blog。將自己的md檔寫好後，放在檔案裏面後，將其轉換成靜態的HTML檔。

所以，主要步驟就是使用 Node.js 的軟體安裝器 npm 來安裝 Hexo 這款軟體後，建立一個部落格後。設置基本設置後，編寫新的文章。最後，再將其輸出成靜態網站，並上傳至自己的網頁伺服器中。

本文章參考至 How to Create a Blog with Hexo On Ubuntu 14.04 - DigitalOcean.com by C.J. Scarlett

Step 1 - 安裝

首先我們必須安裝Hexo的基本套件，所以我們直接在終端機打入指令，安裝hexo-cli即可。

1
npm install hexo-cli -g

接下來，除了基本套件外也要記得安裝伺服器版本，以讓自己可以進行測試用途。只要安裝hexo-server這個套件。

1
npm install hexo-server -g

這樣我們就完成了基本需要的部分，如有其他需要的套件也可以在 npm 上搜索到。

接下來，我們必須設定一個專門放部落格的位置。這邊我們直接在本地下建立一個 blog 資料夾。並進行安裝。

1
2
3
hexo init ~/blog
cd ~/hexo_blog
npm install

Step 2 - 基本設置

接下來我們要將我們建設的部落格，來作設置的動作。這就需要去編輯 blog 資料夾中的 _config.yml 了。

首先，先設定網頁資訊。

1
2
3
4
5
6
7
# Site
title: #部落格名稱
subtitle: #部落格說明
description: #自介
author: #名字
language: zh-tw #語言
timezone: Asia/Taipei #時區

然後，我們要來設定檔案位置與檔案的部分。

1
2
3
4
5
6
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://localhost #網址
root: / #存放目錄
permalink: :year/:month/:day/:title/ #文章存放位置
permalink_defaults:

Step 3 - 編寫新的文章

接下來，我們要來建立新的文章來測試。就以 first-post 作為命名吧。

1
hexo new first-post

雖然檔案系統是支援中文，不過推薦文章都以英文命名。之後Markdown內文再修改成中文即可

之後，它將會顯示它建立的位置在哪裡。你就可以直接過去編輯它。

1
INFO  Created: ~/blog/source/_post/first-post.md

內容如下

1
2
3
4
5
6
7
8
9
10
title: 新文章名稱
tags:
  - 你的標籤
  - 可以不斷加下去
categories:
  - 你的分類
comments: true #是否要使用留言功能
date: 2015-12-31 00:00:00 #文章編寫時間
---
以及你的Markdown內文在這邊。

Step 5 - 開始測試

接下來我們要使用測試功能，也就是Hexo的伺服器功能。所以我們只要敲入指令即可開啟。

1
hexo server

注意: 這個指令必須要在 blog 資料夾中才有作用。

之後它就會顯示你的網頁位置，正常來講都是 *http://localhost:4000/*，所以我們就進去訪問一下即可。

之後，如果要關閉了。直接使用 終端程式程式關閉法 Ctrl+C 即可。

伺服器功能比較容易吃效能，所以並不推薦直接使用這個功能作為伺服器給大家看。

Step 6 - 輸出與上傳

接下來，如果在本地有用 Nginx 網頁伺服器的話，我們就可以找個目錄來跟部落格作連結。我的作法是這樣。

1
2
3
sudo mkdir -p /var/www/html/blog
sudo chown -R $USER:$USER /var/www/html/blog
ln -s /var/www/html/blog ./blog/public

然後，我們就可以進行輸出的動作。

1
hexo g

這樣就大功告成了。自己的靜態Markdown部落格建置完成。