一、寫作
你可以執行下列命令來創建一篇新文章:
$ hexo new [layout] <title>
您可以在命令中指定文章的佈局(layout
),默認爲 post
,可以通過修改 _config.yml
中的 default_layout
參數來指定默認佈局。
1.1 佈局(Layout)
Hexo
有三種默認佈局:post
、page
和 draft
,它們分別對應不同的路徑,而您自定義的其他佈局和 post
相同,都將儲存到 source/_posts
文件夾。
佈局 | 路徑 |
---|---|
post | source/_posts |
page | source |
draft | source/_drafts |
不要處理我的文章
如果你不想你的文章被處理,你可以將Front-Matter
中的layout:
設爲false
。
1.2 文件名稱
Hexo
默認以標題做爲文件名稱,但您可編輯 new_post_name
參數來改變默認的文件名稱,舉例來說,設爲 :year-:month-:day-:title.md
可讓您更方便的通過日期來管理文章。
變量 | 描述 |
---|---|
:title | 標題(小寫,空格將會被替換爲短槓) |
:year | 建立的年份,比如, 2015 |
:month | 建立的月份(有前導零),比如, 04 |
:i_month | 建立的月份(無前導零),比如, 4 |
:day | 建立的日期(有前導零),比如, 07 |
:i_day | 建立的日期(無前導零),比如, 7 |
1.3 草稿
剛剛提到了 Hexo
的一種特殊佈局:draft
,這種佈局在建立時會被保存到 source/_drafts
文件夾,您可通過 publish
命令將草稿移動到 source/_posts
文件夾,該命令的使用方式與 new
十分類似,您也可在命令中指定 layout
來指定佈局。
$ hexo publish [layout] <title>
草稿默認不會顯示在頁面中,您可在執行時加上 --draft
參數,或是把 render_drafts
參數設爲 true
來預覽草稿。
1.4 模版(Scaffold)
在新建文章時,Hexo
會根據 scaffolds
文件夾內相對應的文件來建立文件,例如:
$ hexo new photo "My Gallery"
在執行這行指令時,Hexo
會嘗試在 scaffolds
文件夾中尋找 photo.md
,並根據其內容建立文章,以下是您可以在模版中使用的變量:
變量 | 描述 |
---|---|
layout | 佈局 |
title | 標題 |
date | 文件建立日期 |
二、Front-matter
Front-matter 是文件最上方以 ---
分隔的區域,用於指定個別文件的變量,舉例來說:
---
title: Hello World
date: 2013/7/13 20:46:25
---
以下是預先定義的參數,您可在模板中使用這些參數值並加以利用。
參數 | 描述 | 默認值 |
---|---|---|
layout | 佈局 | |
title | 標題 | |
date | 建立日期 | 文件建立日期 |
updated | 更新日期 | 文件更新日期 |
comments | 開啓文章的評論功能 | true |
tags | 標籤(不適用於分頁) | |
categories | 分類(不適用於分頁) | |
permalink | 覆蓋文章網址 |
2.1 分類和標籤
只有文章支持分類和標籤,您可以在 Front-matter
中設置。在其他系統中,分類和標籤聽起來很接近,但是在 Hexo
中兩者有着明顯的差別:分類具有順序性和層次性,也就是說 Foo, Bar
不等於 Bar, Foo
;而標籤沒有順序和層次。
分類方法的分歧:通常分類可以是同級的,也可以是父子分類。但是Hexo不支持指定多個同級分類。 下面的指定方法:
categories:
- Diary
- Life
會使分類Life成爲Diary的子分類,而不是並列分類。因此,有必要爲您的文章選擇儘可能準確的分類。
2.2 JSON Front-matter
除了 YAML
外,你也可以使用 JSON
來編寫 Front-matter
,只要將 ---
代換成 ;;;
即可。
三、標籤插件(Tag Plugins)[非重點]
聲明:功能非常強大,但是簡書以及CSDN不支持,爲了保證通用性,此功能不詳細深入。如果想詳細瞭解可參考《標籤插件》。
標籤插件 和 Front-matter 中的標籤不同,它們是用於在文章中快速插入特定內容的插件。
引用塊
在文章中插入引言,可包含作者、來源和標題。
別號: quote
{% blockquote [author[, source]] [link] [source_link_title] %}
content
{% endblockquote %}
代碼塊
在文章中插入代碼。
別名: code
{% codeblock [title] [lang:language] [url] [link text] %}
code snippet
{% endcodeblock %}
Pull Quote
在文章中插入 Pull quote。
{% pullquote [class] %}
content
{% endpullquote %}
jsFiddle
在文章中嵌入 jsFiddle。
{% jsfiddle shorttag [tabs] [skin] [width] [height] %}
Gist
在文章中嵌入 Gist。
{% gist gist_id [filename] %}
iframe
在文章中插入 iframe。
{% iframe url [width] [height] %}
Image
在文章中插入指定大小的圖片。
{% img [class names] /path/to/image [width] [height] [title text [alt text]] %}
Link
在文章中插入鏈接,並自動給外部鏈接添加 target=”_blank” 屬性。
{% link text url [external] [title] %}
Include Code
插入 source 文件夾內的代碼文件。
{% include_code [title] [lang:language] path/to/file %}
Youtube
在文章中插入 Youtube 視頻。
{% youtube video_id %}
Vimeo
在文章中插入 Vimeo 視頻。
{% vimeo video_id %}
引用文章
引用其他文章的鏈接。
{% post_path slug %}
{% post_link slug [title] %}
引用資源
引用文章的資源。
{% asset_path slug %}
{% asset_img slug [title] %}
{% asset_link slug [title] %}
Raw
如果您想在文章中插入 Swig 標籤,可以嘗試使用 Raw 標籤,以免發生解析異常。
{% raw %}
content
{% endraw %}
四、資源文件夾
資源(Asset)代表 source
文件夾中除了文章以外的所有文件,例如圖片、CSS、JS 文件等。比方說,如果你的Hexo項目中只有少量圖片,那最簡單的方法就是將它們放在 source/images
文件夾中。然後通過類似於![](/images/image.jpg)
的方法訪問它們。
4.1 相對路徑引用的標籤插件
通過常規的 markdown
語法和相對路徑來引用圖片和其它資源可能會導致它們在存檔頁或者主頁上顯示不正確。在Hexo 2時代,社區創建了很多插件來解決這個問題。但是,隨着Hexo 3 的發佈,許多新的標籤插件被加入到了核心代碼中。這使得你可以更簡單地在文章中引用你的資源。
{% asset_path slug %}
{% asset_img slug [title] %}
{% asset_link slug [title] %}
比如說:當你打開文章資源文件夾功能後,你把一個 example.jpg
圖片放在了你的資源文件夾中,如果通過使用相對路徑的常規 markdown
語法 ![](/example.jpg)
,它將 不會 出現在首頁上。(但是它會在文章中按你期待的方式工作)
正確的引用圖片方式是使用下列的標籤插件而不是 markdown
:
{% asset_img example.jpg This is an example image %}
通過這種方式,圖片將會同時出現在文章和主頁以及歸檔頁中。
五、數據文件
有時您可能需要在主題中使用某些資料,而這些資料並不在文章內,並且是需要重複使用的,那麼您可以考慮使用 Hexo 3.0 新增的「數據文件」功能。此功能會載入 source/_data
內的 YAML
或 JSON
文件,如此一來您便能在網站中複用這些文件了。
舉例來說,在 source/_data
文件夾中新建 menu.yml
文件:
Home: /
Gallery: /gallery/
Archives: /archives/
您就能在模板中使用這些資料:
<% for (var link in site.data.menu) { %>
<a href="<%= site.data.menu[link] %>"> <%= link %> </a>
<% } %>
渲染結果如下 :
<a href="/"> Home </a>
<a href="/gallery/"> Gallery </a>
<a href="/archives/"> Archives </a>
六、服務器
6.1 hexo-server
Hexo 3.0
把服務器獨立成了個別模塊,您必須先安裝 hexo-server
才能使用。
$ npm install hexo-server --save
安裝完成後,輸入以下命令以啓動服務器,您的網站會在 http://localhost:4000
下啓動。在服務器啓動期間,Hexo
* 會監視文件變動並自動更新,您無須重啓服務器。*
$ hexo server
如果您想要更改端口,或是在執行時遇到了 EADDRINUSE
錯誤,可以在執行時使用 -p
選項指定其他端口,如下:
$ hexo server -p 5000
靜態模式
在靜態模式下,服務器只處理 public
文件夾內的文件,而不會處理文件變動,在執行時,您應該先自行執行 hexo generate
,此模式通常用於生產環境(production mode)下。
$ hexo server -s
自定義 IP
服務器默認運行在 0.0.0.0
,您可以覆蓋默認的 IP
設置,如下:
$ hexo server -i 192.168.1.1
指定這個參數後,您就只能通過該IP才能訪問站點。例如,對於一臺使用無線網絡的筆記本電腦,除了指向本機的 127.0.0.1
外,通常還有一個 192.168.*.*
的局域網IP,如果像上面那樣使用 -i
參數,就不能用 127.0.0.1
來訪問站點了。對於有公網IP的主機,如果您指定一個局域網IP作爲 -i
參數的值,那麼就無法通過公網來訪問站點。
6.2 Pow
Pow
是一個 Mac
系統上的零配置 Rack
服務器,它也可以作爲一個簡單易用的靜態文件服務器來使用。
安裝
$ curl get.pow.cx | sh
設置
在 ~/.pow
文件夾建立鏈接(symlink)。
$ cd ~/.pow
$ ln -s /path/to/myapp
您的網站將會在 http://myapp.dev
下運行,網址根據鏈接名稱而定。
七、生成器
使用 Hexo
生成靜態文件快速而且簡單。
$ hexo generate
7.1 監視文件變動
Hexo
能夠監視文件變動並立即重新生成靜態文件,在生成時會比對文件的 SHA1 checksum
,只有變動的文件纔會寫入。
$ hexo generate --watch
7.2 完成後部署
您可執行下列的其中一個命令,讓 Hexo
在生成完畢後自動部署網站,兩個命令的作用是相同的。
$ hexo generate --deploy
$ hexo deploy --generate
上面兩個命令可以簡寫爲:
$ hexo g -d
$ hexo d -g
八、部署
Hexo
提供了快速方便的一鍵部署功能,讓您只需一條命令就能將網站部署到服務器上。
$ hexo deploy
在開始之前,您必須先在_config.yml
中修改參數,一個正確的部署配置中至少要有 type
參數,例如:
deploy:
type: git
您可同時使用多個 deployer
,Hexo
會依照順序執行每個 deployer
。
deploy:
- type: git
repo:
- type: heroku
repo:
縮進
YAML依靠縮進來確定元素間的從屬關係。因此,請確保每個deployer的縮進長度相同,並且使用空格縮進。
8.1 Git
$ npm install hexo-deployer-git --save
修改 站點配置文件
:
deploy:
type: git
repo: <repository url>
branch: [branch]
message: [message]
Hexo 生成的所有文件都放在 public 文件夾中,您可以將它們複製到您喜歡的地方。
而Heroku、Rsync、OpenShift、FTPSync
的部署可以參考《部署》。