How to Build a Blog in Hexo - Customize Themes

Posted on | Edited on | In ,

這篇文章主要是分享修改一些主題配置的心得。

在網路上拿 Hexo 當作部落格的使用者，他們主題大部分都是用 NexT，這邊就不贅述如何套用 Themes，相關套用主題的文章可以參考：

那麼我就先修改 favicon 開始說起

為 Blog 加入 Browser Tab ico 圖示

Create favicon.ico

在 放置在 主题配置文件 中的选项 有提到，NexT 0.2開始後就不再將favicon.ico放在 hexo-site-path/themes/[theme-name]/source 內了，不過，經過測試後還是能放，只是還沒發現後續會有什麼影響。

這裡我用朋友在幾年前上課時候畫的一張圖來當測試

  • 測試圖：


將這張圖經過：

  1. CUT MY Pic
    • 線上圖片製作修改
  2. Favicon & App Icon Generator
    • 線上將 上面步驟產出的圖片 轉換成favicon (.ico)
    • 你可選擇只有產出16x16的ico還是是用於各個平台及Apps使用的ico

最後產出的結果圖：


  • 假設你選擇16x16的ico，那麼就直接將檔案放置正確位置就好。
  • 若你選擇另一個是用於各個平台及Apps使用的ico，下載下來會是個 zip 檔案，解壓縮後，我是選擇96x96的ico更名為favicon.ico，再將檔案放在正確位置即可。
    • 如果你是Mac OS X使用者，在更改檔名的時候會跳出選擇副檔名的訊息，記得選擇更改為ico。

接著，我們這裡還是根據官方所說將檔案放在hexo-site-path/source/目錄吧！

最後，將 瀏覽器 重新啟動 就好。

Notice! 假設，你修改或變更 favicon.ico ，結果不如預期的話，不妨試著將瀏覽器清除記錄並重新啟動瀏覽器。

效果圖：



See also - favicon.ico