Hexo搭建個人博客

第一步:Hexo

使用了Hexo腳手架。
首先找一個放置腳手架的目錄,輸入以下命令完成安裝:

npm install hexo-cli -g
hexo init blog
cd blog
npm install

文件目錄大致如下:

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

-config.yml中是博客參數配置
scaffoles中是模板文件,可以修改文章的模板
source中是博客中的靜態資源,這篇文章就是通過source/_posts目錄下的md文檔寫的
themes中是主題樣式,是編寫博客樣式的地方,可以自己編,也可以用現成的

然後就可以在配置文件-config.yml中綁定自己的域名。我用的是github.io,可以參考搭建免費個人博客詳細教程進行配置。
綁定域名後就可以上傳博客頁面了。

下面是一些常用hexo命令:

hexo g          //生成項目
hexo s --debug  //本地調試(熱更新)
hexo clean      //清除生成項目
hexo d          //部署項目

如果直接生成並部署項目,打開網頁會看到Hexo提供的默認主題。主題存放於themes文件夾下,默認的主題名爲landscape,文件夾名即爲主題名,可在配置文件-config.ymltheme項中更改。但前提是themes目錄下有其他的主題。

第二步:主題

說實話,Hexo默認的主題landscape就不錯,簡潔大氣,但直接用默認主題就沒意思了。GitHub上頁有一些不錯的主題模板,比如Next,星星是最高的,但感覺頁面效果也沒那麼好,而且想用Next也有不少配置要學,索性自己從零開始搭建。

我的主題主要是仿照默認主題的結構編寫。landscape主題目錄下有languages、layout、scripts和source四個文件夾,languages存放語言配置文件,layout存放頁面模板文件,scripts存放Hexo腳本,source存放頁面樣式、圖片、字體等資源文件。

由於主題文件的編寫是採用ejs模板引擎,所以如果沒接觸過ejs可能不好上手。可以參考從零開始製作Hexo主題進行編寫。

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