如何部署一个类似此网页的个人网站

使用hugo模板将个人网站部署在netlify上

如果你需要快速搭建一个个人网站，你可以参考本文章 本部署方式参考了【大学生提高课】3 hexo与hugo博客搭建与github自动化推送和服务器推送 感谢他的教程让我成功用此方法成功搭建了个人网站，如果你看不懂我的文字版，你可以看他的视频版

首先打开hugo官网,如果需要更详细的信息，你可以在这个官网上查看 点击中间的getting started 然后依次点击quick start，install hugo 根据你电脑的系统选择并安装对应的版本 (其实我是直接在GitHub上搜索hugo并安装的)github上的hugo（写到一半才想起来我是这么安装的） 下面是如何在GitHub上安装hugo 进入GitHub上的hugo后点击右侧的releases，选择要下载的版本，请下载extended版本的 extended自带所需的sass windows下载下图所示版本 将zip文件解压，将hugo.exe文件所在的目录添加到环境变量 如何添加环境变量？ 简易版 [深度了解版](Windows 中的环境变量（Windows11 为例）_win11环境变量-CSDN博客) 在你准备好的文件夹中打开命令行（在空白处点击右键选择在终端中打开）输入以下命令

hugo new site blod

此时在这个文件夹下将会创建一个blog文件夹 到此为止最基础的工作已经完成了，我们已经拥有了一个个人网站的模板，接下来我们要为我们的网站选择一个主题 回到hugo主页点击左上角的Themes 在这里你可以为你的个人网站选择一个预设好的主题 我将使用[TeXify3](TeXify3 | Hugo Themes)这个主题来做示范 点击download按钮会跳转到主题的GitHub页面，点击code，点击download zip

下载并解压源码，将源码文件整个放入之前用命令行创建的blog文件夹下的theme文件夹中，删除hugo-texify3-master文件的后缀-master 复制\blog\themes\hugo-texify3中的layouts文件夹到blog中 复制\blog\themes\hugo-texify3\exampleSite中的所有文件到blog中 如果你有vscode或者类似的编辑器，用编辑器打开blog文件夹 在当前文件夹目录下打开终端输入

hugo

观察是否报错 然后运行以下命令来启动服务

hugo serve

至此你应该得到了一个在本地运行的个人网站（笔者使用此主题部署时发生了报错😭不过别的主题可以成功部署） 接下来你需要将这个文件夹使用git传到github上，注意要设置为public 接下来进入netlify官网点击get started，点击add new site，使用github部署，然后选择刚刚传上去的项目 这里填写你的网站地址（不过很容易重名） 注意选择正确的分支（main或者master） 然后点击deploy html

以下是hugo博客目录下各文件夹的作用 my-hugo-blog/ ├── archetypes/ # 内容模板的原型 ├── content/ # 你所有的博客文章、页面等 ├── data/ # 数据文件 (JSON, YAML, TOML) ├── layouts/ # 网站的 HTML 模板 ├── static/ # 静态文件 (CSS, JS, 图片等) ├── themes/ # 你下载的主题存放处 └── config.toml # 网站的全局配置文件

大功告成，你获得了自己的网站🥳🥳🥳