hugo搭建个人博客步骤及几点注意事项

搭建个人博客需要事先做的准备: 安装 git (opens new window), 注册 github (opens new window) 账号, 安装 hugo (opens new window)

1.下载并安装hugo

​ 在官网下载并安装hugo,可以参考官方的安装教程 (opens new window), 安装完成后还需要进行环境变量的配置, 将Hugo/bin添加到用户变量下的path变量中

2.下载配置hugo主题

​ (1) win+r+cmd进入控制台程序, 然后进入自己的工作区输入hugo new site Blog, 就会生成这几个文件

​ (2) 输入cd Blog进入博客根目录

​ (3)输入下面命令下载主题, 这里以下载cleanwhite主题为例 ,

git init
git submodule add https://github.com/zhaohuabing/hugo-theme-cleanwhite.git themes/hugo-theme-cleanwhite

其他主题也可以修改zhaohuabing/hugo-theme-cleanwhite.git themes/hugo-theme-cleanwhite,当然 , 参考主题发布者的说明更重要 ,

或者进入themes子目录进行下载

cd themes
git clone https://github.com/zhaohuabing/hugo-theme-cleanwhite.git

也可以在hugo主题商店 (opens new window)下载.zip文件,并且解压到Blog/themes文件夹下

​ (4)打开Blog/config.toml文件,并参考hugo-theme-cleanwhite/exampleSite/config.toml文件进行配置,archetypes文件夹下的模版文件也可以参考hugo-theme-cleanwhite/archetypes下的post.md文件来配置, 另外, 将Blog/archetypes中的default.md文件中的draft项的true改为false,draft为false时才可以发布博文

​

3.本地调试博客

上面的配置都完成了之后可以进行博客的本地调试

​ (1)进入根目录, 也就是Blog文件夹下, 执行hugo new posts/test.md命令 , 会在content/posts目录下生成 . md文件 , 如果没有posts文件夹则会在content目录下生成 , 建议手动创建一个posts文件夹用来保存以后博文 , 发布博文也是通过这条命令

​ (2)输入hugo server进行本地调试 , 完成后在浏览器输入http://localhost:1313/即可以看到博客的雏形

4.将本地仓库推送到github

1)新建一个空的仓库 , 命名为用户名.github.io , 注意新建的时候不要生成README文件,否则推送到远端仓库的时候会报错

​ (2)在Blog目录下执行

hugo

命令 , 会生成一个 public 文件夹 , 包括如下内容

需要推送到 github 上的就是这个目录中的内容 , 加载主题时 , themes目录下的 static 和 layouts 这两个文件夹中的内容也会更新到 public 目录下

​ (3)执行cd public命令进入public文件,然后输入如下命令推送到git仓库

git init //第一次执行,生成.git文件
git add . 
git commit -m"Initial commit" 
git remote add origin  https://github.com/ShyArcher/shyarcher.github.io.git
git push -u origin master 

然后就可以通过https://你的仓库名访问自己的博客主页了 , 例如我的博客链接就是https://shyarcher.github.io

tips:

​ a .-m引号中的内容可以自己指定,最好标注每次的改动内容

​ b.下次推送时只需要执行git push指令即可

5.注意事项

​ (1)配置config.toml文件时,需要注意文件的编码格式必须是utf-8,否则博客主页就有可能出现中文乱码的问题 , 写博文时的 . md文件也是同理 . 如果使用记事本编辑config.toml文件 , 只要保存时点文件/另存为 , 再把编码格式改为utf-8即可 . 其他的编辑器也是同理

​ (2)若下载的一些主题没能正常配置 , 可以参考发布者的github说明 , 一般都能找到解决方案

​ (3)如果想要更方便地管理博客 , 可以将整个Blog文件都上传到git作为备份 , 再新建一个git仓库 , 将目前的仓库作为该仓库的子模块 , 在Blog文件夹下操作 , 具体命令如下

git init //如果该目录下已经有了.git文件,也可以不需要这一步
git submodule add https://github.com/github用户名/shyarcher.github.io.git public
git add .
git commit -m"Initial commit"
git remote add origin https://github.com/github用户名/myBlog-hugo.git
git push -u origin master//同理第一次执行时的代码

​ (4)最后一点 , 如果在config文件中找不到需要修改的地方 , 可以去其他.html文件中找就行