在这个信息爆炸的时代，拥有一个个人博客无疑是展示自己思想、分享知识和技能的绝佳平台。本文将指导你如何使用Hugo和WebStack-Hugo主题来无代码搭建一个美观、响应式的个人博客、导航网站。

一、准备工作

在开始之前，确保你的计算机上已经安装了必要的软件和工具。如果没有，不用担心，我们将一步步指导你完成安装过程。

1.下载并安装Hugo

Hugo是一个快速且易用的静态网站生成器，它能够将Markdown或HTML内容转换为静态网站。首先，你需要下载Hugo。

① 访问Hugo的GitHub发布页面，选择适合你操作系统的版本进行下载。

② 如果你无法直接访问GitHub，可以联系我获取Hugo的工具包（后台私信“Hugo”自动回复）。

2. 解压Hugo

下载完成后，将Hugo压缩包解压到你指定的目录中。这将是你管理和构建博客的中心位置。

二、安装WebStack-Hugo主题

WebStack-Hugo是一个基于Hugo的开源主题，它提供了一个现代、简洁且功能丰富的界面。

1. 下载WebStack-Hugo

① 访问WebStack-Hugo的GitHub页面或者GitCode页面进行下载。

② 下载地址：

https://github.com/shenweiyan/WebStack-Hugo

https://gitcode.com/shenweiyan/WebStack-Hugo/overview

③ 同样，如果你需要帮助下载，可以联系我获取工具包（后台私信“Hugo”自动回复）。

2. 解压并重命名

① 解压下载的WebStack-Hugo压缩包。

② 将解压后的文件夹重命名为“WebStack-Hugo”，以确保与Hugo的兼容性。

三、配置Hugo和WebStack-Hugo

1. 创建‘themes’文件夹

在Hugo的解压目录中，创建一个新的文件夹，并命名为‘themes’。

2. 复制exampleSite

① 进入WebStack-Hugo文件夹。

② 将exampleSite文件夹中的所有文件复制到Hugo的解压文件夹内。

四、启动Hugo服务

1. 打开PowerShell或CMD

在Hugo文件夹内，使用Shift+右键打开PowerShell窗口，或者在CMD窗口中打开当前文件夹目录。

2. 执行Hugo命令

在PowerShell或CMD窗口中，执行hugo.exe server命令。这将启动Hugo的本地服务器。

3. 访问本地服务器

启动服务后，你将得到一个本地访问地址。在浏览器中输入该地址，即可预览你的网站。

五、个性化你的网站

1. 修改网站配置

① 在Hugo文件夹内，找到复制过来的config.toml文件。

② 使用文本编辑工具打开config.toml，并根据你的需要修改网站的信息，如标题、描述、作者等。

2. 修改导航内容

① 在Hugo文件夹中，找到复制来的data文件夹。

② 使用文本编辑工具打开webstack.yml文件，进行导航栏内容的修改，以适应你的个人或品牌特色。

六、发布你的网站

一旦你满意你的网站预览，就可以将其发布到互联网上。Hugo支持多种部署方式，包括GitHub Pages、Netlify等。你可以选择一个适合你的方式，将你的静态网站部署到线上。下一篇，讲一讲如何获取需要的网站资源（爬虫爬取资源）

七、更多配置资料

https://github.com/shenweiyan/Knowledge-Garden/discussions/10

推荐阅读:

1.手把手教你搭建网站：赚钱，从搭建个人工具网站开始（起始篇）

2.手把手教你搭建网站：赚钱，从搭建个人工具网站开始（建站篇）

3.不只是浏览：看一看浏览器如何实现自动执行任务？

4.视频翻译，让全球观众都为你打call：三款工具深度评测

5.自动化神器：影刀RPA与千峰办公助手，让你工作高效还能自动赚美金！

6.赚美金的必备工具：指纹浏览器让你的多账号操作更上一层楼！

?点这关注我，记得标星?不迷路！