那種簡約不失大氣,略帶極客風格,有數據統計.稍微有點數據控。


這兩天剛使用hexo搭建好了blog,我是用了icarus這個主題,主題配置起來很方便,主題設計也很簡潔。這裡給大家安利一下這個主題。

這個主題截止我寫這個回答已經收穫了2000多個star。

放上連接

ppoffice/hexo-theme-icarus?

github.com圖標

這是我的blog

xxss blog?

verbf.github.io圖標

接下來介紹一下這個主題。

先看一下效果圖:

我自己diy的首頁

官方的首頁

文章內容詳情頁

歸檔頁

首頁是一個導航欄 + 很清爽的三欄設計

導航欄

最上面是導航欄,包含了個人blog常規的幾個功能:主頁,歸檔,分類,標籤以及關於頁。

導航欄

左上角的logo圖片可以自定義,我放了一個自己做的模仿任天堂的logo圖片。

右上角是github的鏈接圖標和站內查找功能:

github鏈接和查找功能

左邊欄

左邊一欄的上面是個人信息卡片,下面是標籤雲卡片 以及 按時間歸檔文章的卡片

圓角的卡片樣式加陰影設計簡潔又不失細節

官方的個人信息頁還可以添加更多的社交賬號鏈接,但我都用不上,只留了github的鏈接。

官方的個人信息頁

右邊欄

右邊欄會展示最近添加的文章,下面是按照分類歸檔文章的卡片

我的右邊欄

官方的右邊欄

中間欄

中間欄在不同功能下有些變化,但主體都是文章。

首頁的中間欄,一篇文章一個卡片。每篇文章可以選擇添加一個圖片,卡片中包括了文章標題,寫作日期,修改日期,分類,文字統計和預估閱讀時間(自動生成的),以及文章的簡介和標籤等信息。

主頁中間欄

歸檔頁面的中間一欄發上了變化,左邊的時間軸可以很方便的按時間查看自己的文章

歸檔頁中間欄

官方的歸檔頁中間欄

分類頁的中間欄

官方的分類頁中間欄

標籤頁的中間欄

我的標籤頁的中間欄

關於頁的中間欄

關於頁可以放一些自己的個人介紹,我暫時只放了一張圖片

文章詳情頁

文章詳情頁為了凸顯文章內容,我將官方的三欄改成了兩欄。

效果還是蠻好的

文章內容詳情頁-1

文章內容詳情頁-2

文章內容詳情頁中,左邊欄有了變化,個人信息卡片下面變成了文章的目錄卡片,如果你的文章內按照markdown的語法對文章內的標題分了級,那麼這個主題就會自動生成一個目錄,並且自動編號,這個就很貼心了。

文章目錄卡片

其他功能

此外這個主題還支持很多其他的插件,都可以根據自己喜好配置,我簡單列舉幾個:

打賞功能

打賞功能卡片

轉載聲明

轉載聲明卡片

訪客統計

訪客統計

mathjax

同樣支持mathjax

評論功能

除了這些之外,這個主題還支持cdn加速等 很多功能,大家可以自行摸索,有問題可以到github上去提問,作者還是十分熱心的。

最後,要是大家覺得主題還不錯的話,可以到作者的github上給個star支持一下,這裡在附上主題github地址

ppoffice/hexo-theme-icarus?

github.com圖標

主題使用說明:

Icarus?

blog.zhangruipeng.me圖標

也可以到我的blog轉轉

xxss blog?

verbf.github.io圖標


推薦使用 Hugo 寫博客,我以前也是用Hexo,但是依賴庫太多,更新比較麻煩。

後來換成了Hugo。我自己做了一款Hugo的主題,可以參考使用。

rujews/maupassant-hugo

遷移可以參考這篇文章

從Hexo遷移到Hugo-送漂亮的Hugo Theme主題 - 飛雪無情的博客


Material X | xaoxuu?

xaoxuu.com圖標honjun/hexo-theme-sakura?

github.com圖標matery?

github.com

luuman/hexo-theme-spfk?

github.com圖標Life - 記錄生活,為寫作而生WEIC`S BLOG?

isweic.com圖標ppoffice/hexo-theme-icarus?

github.com圖標kevinma2010/hexo-theme-vno?

github.com圖標DIYgod/hexo-theme-sagiri?

github.com圖標

簡潔清爽系主題 ocean https://zhwangart.github.io


沒有人說Yilia嗎?

接觸Hexo之後用了很多主題,最後停在了Yilia,喜歡它的:

簡潔,美觀,拓展性強

我的博客:

dongshuyan.com?

dongshuyan.com

怎麼搭建Yilia博客:

http://dongshuyan.com/2016/04/07/怎麼寫博客/?

dongshuyan.com

搭建Yilia高級教學:

http://dongshuyan.com/2019/05/24/hexo博客注意事項/?

dongshuyan.com


推薦閱讀:
相关文章