Hugoplate 是一個使用 Hugo 和 TailwindCSS 建立的免費入門模板,提供快速啟動 Hugo 專案並節省寶貴時間所需的一切。
由 Zeon Studio 使用 ♥ 製作
如果您覺得這個項目有用,請給它一個以表示您的支持。
我們已經包含了啟動 Hugo 專案所需的幾乎所有內容。讓我們看看這個模板包含哪些內容:
多作者
類似貼文建議
搜尋功能
深色模式
標籤和類別
預先設定的 Netlify 設定
支援聯絡表
完全響應
在 Markdown 中撰寫和更新內容
評論
語法高亮
首頁
關於
接觸
作者
作者單曲
部落格
部落格單曲
客製404
元素
隱私權政策
標籤
標籤單曲
類別
類別 單人
搜尋
雨果
順風CSS
後CSS
清除CSS
自動前綴器
Gethugothemes 的 Hugo 模組
降價
更漂亮
傑辛特
網路化
韋爾塞爾
Github 操作
亞特實驗室CI
AWS 放大
首先,您需要克隆或下載模板存儲庫,然後讓我們開始以下過程:
要開始使用此模板,您需要在電腦上安裝一些先決條件。
Hugo 擴充版 v0.124+
節點 v20+
去 v1.22+
我們建立這個自訂腳本是為了讓您的專案設定更容易。它將建立一個新的 Hugo 主題資料夾,並將 Hugoplate 主題複製到其中。然後將 exampleSite 資料夾移到根目錄中。這樣您就可以啟動 Hugo 伺服器而無需進入 exampleSite 資料夾。使用以下命令來設定您的項目。
npm run 專案設定
使用以下命令安裝所有相依性。
npm 安裝
使用以下命令啟動開發伺服器。
npm 運行開發
此範本的設計考慮了許多自訂選項。您幾乎可以自訂任何您想要的內容,包括:
您可以從hugo.toml
檔案中更改網站標題、基本URL、語言、主題、外掛程式等。
您可以自訂config/_default/params.toml
檔案中的所有參數。這包括徽標、網站圖標、搜尋、SEO 元資料等。
您可以從data/theme.json
檔案更改顏色和字體。這包括主要顏色、次要顏色、字體系列和字體大小。
您可以從data/social.json
檔案更改社交連結。在此處添加您的社交鏈接,它們將自動顯示在網站上。
我們添加了一些自訂腳本,讓您的生活更輕鬆。您可以使用這些腳本來幫助您進行開發。
如果你想更新主題,那麼你可以使用以下指令。它將把主題更新到最新版本。
npm 運行更新主題
注意:此命令將在運行
project-setup
腳本後生效。
我們在這個模板中加入了很多模組。您可以使用以下命令更新所有模組。
npm 運行更新模組
如果您想從專案中刪除暗模式,可以使用下列命令從專案中刪除暗模式。
npm run 刪除暗模式
注意:此命令將在運行
project-setup
腳本之前起作用。如果您已經執行了project-setup
指令,則必須先執行npm run theme-setup
,然後才能執行此指令。之後,您可以再次執行npm run project-setup
。
完成開發後,您幾乎可以在任何地方建置或部署您的專案。我們看一下過程:
要在本地建置項目,您可以使用以下命令。它將清除所有未使用的 CSS 並縮小所有檔案。
npm 運行構建
我們使用此範本提供了 5 種不同的部署平台配置,以便您可以輕鬆部署。
網路化
韋爾塞爾
Github 操作
亞特實驗室CI
AWS 放大
如果您想託管其他一些託管平台。然後你就可以建立你的項目,你將得到一個public
資料夾。您可以將其複製並貼上到託管平台上。
注意:您必須更改
hugo.toml
檔案中的baseURL
。否則,您的網站將無法正常運作。
我們使用 GitHub Issues 作為此範本的官方錯誤追蹤器。請搜尋現有問題。可能有人已經報告了同樣的問題。如果您的問題或想法尚未解決,請隨時提出新問題。
版權所有 (c) 2023 - 目前,由 Zeon Studio 設計和開發
代碼許可證:根據 MIT 許可證發布。
圖片許可:圖片僅用於演示目的。他們有他們的許可證,我們無權分享這些圖像。
人們正在使用Hugoplate建立的一些項目清單!
開放神經形態 | 人工智慧模型 | 雨果布里克斯 | 小野有限公司 |
如果您需要自訂主題、主題定製或從頭開始的完整網站開發服務,您可以僱用我們。