如何用Hugo搭建个人博客

448 阅读2分钟

每日学的东西很多,确实可以通过博客进行整理回顾,也便于知识的共享。写博客的平台很多,方法也很多。这里和大家推荐使用Hugo搭建个人博客的方法。

Hugo是什么?


Hugo是由Go语言实现的静态网站生成器。具有简单、易用、易扩展、快速部署等一些特点,通过LiveReload实时刷新,极大的优化文章写作体验。

Hugo可以作为一些展示类网站的解决方案,比如个人博客、产品介绍、个人作品介绍、文档介绍等等,

快速开始

  • 安装Hugo


Mac用户直接使用 Homebrew 安装


brew install hugo


  • 搭建博客
1. 进入[Hugo官网](https://gohugo.io/) 点击下方的
2. **建立新网站**接下来需要根据官网中的步骤顺序复制代码,打开iTerm,由于我们前面已经安装过Hugo,所以直接从第二步开始,复制第二步代码

hugo new site quickstart
这里的quickstart为我们的仓库名,需要换成我们自己的github的名字,并在后面加上.github.io-creator,以我为例:

hugo new site dsplk.github.io-creator
这样,我们就创建了博客的生成器,我们在vscode打开此目录
  •  添加主题
在我们创建的.github.io-creator目录下,进行初始化

git init
接着我们下载主题,复制主页中的第三行代码

git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke
最后,将主题添加到站点配置中

echo 'theme = "ananke"' >> config.toml
  • 添加内容
在命令行中驶入下面代码,创建我们要写的文章

   hugo new posts/my-first-post.md
ps: my-first-post为我们博客的题目,可以自己命名

打开我们创建的md文件,输入我们要写的博客,之后将文件最顶端的’draft‘属性改为false

draft:true 为草稿状态,不能发布,需要改为false**

  •  启动服务器

hugo server -D
结果如下图


  • 自定义主题
我们找到`config.toml`在vscode中打开,将我们博客的名字,语言进行自定义设置


  • 建立静态页面

hugo -D
这样,我们就生成了.public的静态文件,我们需要把里面的挂到github上才可以随时观看

上传github

新建本地仓库

1. 在creator目录中新建.gitignore文件
2. 在文件中输入/public/保存,意思为在上传本地仓库时,不要上传public文件夹
3. 在public目录中,依次输入以下代码

 cd public  
 git init 
  git add .   
git commit -v

新建远程仓库

1. github上新建仓库,命名为github用户名.github.io
2. 使用ssh上传

新建备份仓库

1. github上新建仓库,命名为github用户名.github.io-creator
2. 在creator目录下,使用ssh上传代码