hexo + next 創建個人博客

hexo是一個github上開源的博客系統,可以根據markdown的文檔生成靜態的html文件。只需要簡單的命令就可以實現自動提交及部署到github的強大工具。
hexo還提供了海量的主題風格供用戶選擇,本文討論的是next主題的使用及優化。
其他主題可以多看看官方文檔https://hexo.io/themes/

安裝hexo

  1. 下載&安裝node.js
  2. 安裝hexo
$ npm install hexo-cli -g

注:由於npm是從國外下載資源,推薦使用cnpm淘寶鏡像,安裝後可以使用cnpm來替代所有的npm

$ npm install -g cnpm --registry=https://registry.npm.taobao.org
  1. 創建一個hexo
$ hexo init blog
  1. 安裝必要的插件
$ cd blog
$ npm install
  1. 啓動hexo
$ hexo server

以上就配置了一個簡單的hexo項目

項目效果如下:

目錄基本介紹

新建完成後,指定文件夾的目錄如下:

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

_config.yml

網站的 配置 信息,您可以在此配置大部分的參數。

scaffolds

模版 文件夾。當您新建文章時,Hexo 會根據 scaffold 來建立文件。

Hexo的模板是指在新建的markdown文件中默認填充的內容。例如,如果您修改scaffold/post.md中的Front-matter內容,那麼每次新建一篇文章時都會包含這個修改。

source

資源文件夾是存放用戶資源的地方。除 _posts 文件夾之外,開頭命名爲 _ (下劃線)的文件 / 文件夾和隱藏的文件將會被忽略。Markdown 和 HTML 文件會被解析並放到 public 文件夾,而其他文件會被拷貝過去。

themes

主題 文件夾。Hexo 會根據主題來生成靜態頁面。

安裝next主題

這裏是從github上下載next主題,這裏需要本地安裝有git,也可以去官網上下載到桌面解壓到themes/

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

設置主題

在hexo根目錄下的配置文件config.yml裏設置主題

theme: next

配置主題

接下來我們就可以來按需配置主題內容了,所有內容都在themes/next文件夾下的config.yml文件裏修改。
官方文檔裏寫的是有些配置需要將一部分代碼添加到配置文件中,但其實不用,我們逐行看配置文件就會發現,有很多功能都已經放在配置文件裏了,只是註釋掉了,我們只需要取消註釋,把需要的相關信息補全即可使用

個人網站效果http://www.yigehui.top

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章