前言

一個網站的佈景與網站本身想傳達的訊息、用途息息相關，選定一個好的主題往往可以替網站加分不少，今天要來聊聊我是如何挑選 Hugo Themes 給大家參考。

網站用途

設想一下你想自架網站的用途，有了明確的架設意圖後，可以有效的縮小挑選範圍，以下舉幾個栗子：

• 個人技術部落格
• 登陸頁 Landing Page
• 官方形象網站
• 個人履歷作品網站
• 專題報導網站，旅遊、美食、攝影...
• ..等等

佈景風格

建議先問問自己想要的感覺，找幾個你有看過、喜歡的部落格風格，列出幾個一定要有的特點，在此提供幾個我自己的評估方向做參考：

• 整體樣式: 你曾經看過的部落格樣式，你想要用跟他相似的，或是想用成一樣的
• 特定文章: 例如你要專寫技術文章，可以透過 Hugo Theme 右側列出的 tag 去查找

• 內外佈局: 文章展開 (繼續閱讀 more) 前後的感覺，是否要有側邊欄 (Menu)，或導航列 (Navbar) 等
• 選單圖案: 佈景提供的 Menu 連結搭配的 icon 樣式與排列
• markdown style: 佈景 demo 通常會有 markdown showcase 文章供你參考，可以藉由範例展示想像一下文章寫完的樣子
• code block style: 佈景的 code block 是否方便透過 config 替換樣式、顯示行號
• shortcode: 額外工具，例如 Highlight Text 、數學公式、流程圖繪製、 GA 、評論系統等
• 其他功能: 分頁連結 (Pagination)，顯示預估閱讀時間 (Reading time) 等

選定幾個，然後把手弄髒

在你備選的幾個佈景輪流試用中，根據每種佈景作者提供的參數，去切換參數設置看看，你才知道哪些是可隨你意思做動的部分，而哪些是你以後寫文章會需要常用到的。

我自己是從「佈局」與「整體感覺」先挑出幾個候選，然後每種我覺得會用到的工具都設定試試看，若是有些許的不適用，還是可以透過覆寫的方式、shortcode 方式去試著達成，這在之後的文章會在稍作分享。

小結

我一開始選擇試用的佈景不多，目前套用嘗試過三款就先定案了，以後如果有更多想法還是可以隨時替換，hugo 參數都是通用的。

明天會介紹一款我正在使用的 Hugo 佈景，與一些設置經驗分享。

參考連結

• Hugo Themes