使用Hugo+Github创建个人博客

展示图片

原理：

使用Hugo生成静态网页，做成自己的网站，用Github Pages来托管你的网站。

此教程使用于Windows.

概览：

1. Hugo是什么
2. Github Pages是什么
3. 安装Hugo
4. 安装Git 
5. Hugo主题下载配置
6. 上传 Github

1. Hugo是什么

Hugo 是一个基于 Go 语言开发的静态站点生成工具。

Hugo特点：

无需数据库、无需需要各种权限的插件、无需跑在服务器上的底层平台，更没有额外的安全问题。
都是静态站点，因此拥有轻量级、快速响应的服务性能。此外，所有的网页都是在部署的时候生成，所以服务器负载很小。
极易操作的版本控制。一些 CMS 平台使用它们自己的版本控制软件（VCS）或者在网页上集成 Git 工具。而 Hugo，所有的源文件都可以用你所选的 VCS 软件来管理。

更多的关于Hugo的介绍，请参考Hugo的官网 https://gohugo.io/ 。

2. Github Pages是什么

GitHub Pages是GitHub提供的一个网页寄存服务，于2008年推出。可以用于存放静态网页，包括博客、项目文档甚至整本书。Jekyll软件可以用于将文档转换成静态网页，该软件提供了将网页上传到GitHub Pages的功能。一般GitHub Pages的网站使用github.io的子域名，但是用户也可以使用第三方域名。

注：相当于用Hugo替换Jekyll生成静态网页。关于Hugo较于Jekyll的优势：Jekyll、Hugo、Hexo对比

3. 安装Git

Git官网下载：Git

安装一路默认就行。

下载完成，通过在命令行输入 git version 查看是否安装成功，有输出版本号说明安装成功。

鼠标邮件菜单里就多了Git GUI Here和Git Bash Here两个按钮，一个是图形界面的Git操作，一个是命令行。

安装教程：如何在windows下安装GIT
Git入门教程：Pro Git（中文版）
Git基本操作：Git基本操作

4. 安装Hugo

官方文档：Hugo中文文档

此处推荐使用二进制安装。

Hugo二进制文件下载：Hugo Releases

hugo_0.53_Windows-64bit.zip

选择对应的版本，下载后解压放入任意路径下，如：D:\Blog\Hugo。双击执行。

配置环境变量：

找到系统变量下 -Path-编辑-新建 D:\Blog\Hugo即hugo.exe的路径。

验证安装

打开cmd命令窗口，输入如下命令验证是否安装成功

hugo version

如果没问题的话，会输出Hugo的版本号等一些信息。

创建一个站点

在文件夹下右键，打开 Git Bash Here 命令窗口

hugo new site blog

会生成名为 blog 的文件夹，以下为生成的站点结构，themes下放的模板文件，config.toml是站点配置文件

▸ archetypes/

▸ content/

▸data/

▸ layouts/

▸ resources/

▸ static/

▸ themes/

config.toml

此时themes文件夹下是没有主题文件的，所以我们需要下载一个主题。

5. Hugo主题下载配置

Hugo主题下载

Hugo官网有很多主题，选择自己喜欢的就好：themes

这里我以 maupassant 主题为例：maupassant

在 blog 文件夹下，执行：

git clone https://github.com/rujews/maupassant-hugo themes/maupassant

然后在Hugo的配置文件里config.toml(yaml,json)中进行如下配置，即可使用。

theme = “maupassant”

maupassant 主题配置

Hugo maupassant 主题配置也不难，是否熟悉Hugo都可以快速配置，并生成自己的网站。我博客的配置如下，大家可以参考。

config.toml

baseURL = "https://vvc-Dream.github.io/"
languageCode = "zh-CN"
title = "vvc-Dream的博客"
theme = "maupassant"

[author]
  name = "vvc-Dream"

[params]
  author = "vvc-Dream"
  subtitle = "vvc-Dream subtitle"
  keywords = "vvc-Dream keywords"
  description = "vvc-Dream description"

maupassant 自定义菜单

[menu]
  [[menu.main]]
    identifier = "books"
    name = "新书"
    url = "/books/"
    weight = 2
  [[menu.main]]
    identifier = "archives"
    name = "归档"
    url = "/archives/"
    weight = 3
  [[menu.main]]
    identifier = "about"
    name = "关于"
    url = "/about/"
    weight = 4

maupassant 添加链接

[[params.links]]
  title = "Github"
  name = "Github"
  url = "https://github.com/vvc-Dream/vvc-Dream.github.io"
[[params.links]]
  title = "哔哩哔哩"
  name = "哔哩哔哩"
  url = "http://space.bilibili.com/44178647?"

至此，基本配置完毕，下面来添加你的个人文章把。

添加一篇文章

hugo new 页面名称 .md #在content文件夹下生成.md内容页

不过我们一般是在content文件夹下新建post文件夹(方便以后聚合内容)来放置.md

hugo new post/first.md

.md为markdown文件

markdown编辑器推荐：markdown

markdown语法汇总：markdown语法

查看运行效果

hugo server -D

然后我们就可以打开浏览器，输入http://localhost:1313查看我们新创建的站点了。

6. 上传Github

若无Github 账号，则先注册 Github 账号：Github注册

注册完登陆后，我们就创建一个我们自己的Github Pages项目。点击New repository。

创建要点如：

Repository name 可任意填，
但点击 Create Repository 后的URL则必须填成：username.github.io

配置SSH密钥

配置Github的SSH密钥可以让本地git项目与远程的github建立联系，让我们在本地写了代码之后直接通过git操作就可以实现本地代码库与Github代码库同步。操作如下：

# 第一步、看看是否存在SSH密钥(keys)

首先，我们需要看看是否看看本机是否存在SSH keys,打开Git Bash,并运行:

$ cd ~/. ssh

检查你本机用户home目录下是否存在.ssh目录

如果，不存在此目录，则进行第二步操作，否则，你本机已经存在ssh公钥和私钥，可以略过第二步，直接进入第三步操作。

# 第二步、创建一对新的SSH密钥(keys)

$ssh-keygen -t rsa -C "your_email@example.com"
#这将按照你提供的邮箱地址，创建一对密钥
Generating public/private rsa key pair.
Enter file in which to save the key (/c/Users/you/.ssh/id_rsa): [Press enter]

直接回车，则将密钥按默认文件进行存储。此时也可以输入特定的文件名，比如/c/Users/you/.ssh/github_rsa

接着，根据提示，你需要输入密码和确认密码（说到这里，如果你很放心，其实可以不用密码，就是到输密码的地方，都直接回车，所以每次push就只管回车就行了。所谓的最安全的密码，就是没有密码哈哈）。相关提示如下：

Enter passphrase (empty for no passphrase): [Type a passphrase]
Enter same passphrase again: [Type passphrase again]

输入完成之后，屏幕会显示如下信息：

Your identification has been saved in /c/Users/you/.ssh/id_rsa.
Your public key has been saved in /c/Users/you/.ssh/id_rsa.pub.
The key fingerprint is:
01:0f:f4:3b:ca:85:d6:17:a1:7d:f0:68:9d:f0:a2:db your_email@example.com

# 第三步、在GitHub账户中添加你的公钥

运行如下命令，将公钥的内容复制到系统粘贴板(clipboard)中。

clip < ~/.ssh/id_rsa.pub

接着：

登陆GitHub,进入你的Account Settings.
选择SSH Keys
粘贴密钥，添加即可

# 第四步、测试

可以输入下面的命令，看看设置是否成功，git@github.com的部分不要修改：

$ ssh -T git@github.com

如果是下面的反馈：

The authenticity of host 'github.com (207.97.227.239)' can't be established.
RSA key fingerprint is 16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48.
Are you sure you want to continue connecting (yes/no)?

不要紧张，输入yes就好。

至此，Github项目已创建好。

上传Github

上传Github：Hugo官方文档

首先通过命令（blog文件夹下）：

hugo

生成要上传的静态文件，存于public 文件加下。

接下来上传：

$ cd public
$ git init
$ git remote add origin https://github.com/coderzh/coderzh.github.io.git
$ git add -A
$ git commit -m "first commit"
$ git push -u origin master

浏览器访问：https://username.github.io/ user替换成你自己的用户名。