这篇文章记录了我用静态博客框架Hugo在Github上搭建博客,使用自定义域名的过程。
静态博客框架有很多个,其中使用人数最多的是Hexo,这个是用JS写成了,有非常多的主题,唯一的缺点就是文章多起来后,编译速度比较慢。Hugo是用Go语言写成的,属于后起之秀,号称编译速度最快,我实际体验下来也觉得如是。
Hexo的开发者多是前端的程序员,看看主题就会发现,个个精美漂亮,小家碧玉。
Hugo的开发者多是后端程序员,主题也部分反应了这情况,糙汉子,五大三粗。
废话不多说,开始搭建步骤。
申请Github账号
如果没有Github账号,第一步就是要申请一个,申请Github账号地址
只需要邮箱地址,按照要求填写就可以了。
Windows安装Git
Git是版本控制工具,程序员都很熟悉,如果你电脑上没有安装Git,需要安装一个,不同的操作系统有不同的安装方法,都很简单,这里以Windows系统为例。
首先下载Git安装包, 和正常的安装方式是一样的。
如果你不懂一切都按照默认的配置,一路next点下去就可以。
安装完成后在桌面的空白区点击右键,可以看到工具栏中多出了Git GUI Here和Git Bash Here的工具,这两个是在当前目录快捷启动Git的方式。
Windows安装Hugo
Hugo是静态博客框架,下载Hugo的地址在这里。
有很多版本供下载,我这里选择hugo_0.80.0_Windows-64bit.zip,下载完毕打开压缩包,发现只有一个hugo.exe文件,在当前目录点击右键调出git bash,运行下命令
hugo version
出现下面的输出
Hugo Static Site Generator v0.65.3-211BA42A windows/amd64 BuildDate: 2020-02-23T09:58:40Z
为了方便在终端中使用hugo,把它配置到系统执行路径里,我在D盘programs下创建了一个script的目录,把这个目录添加path路径中,这样就可以在任何地方执行hugo命令了。
首先右键点击此电脑,点击属性
弹出来的系统设置中点击高级系统设置
会弹出来系统属性对话框
点击环境变量,进行path设置,这里可以选择全局设置和只对当前用户设置。这里我只对当前用户设置,找到Path,点击编辑按钮
然后点击新建,把D:\Programs\script
作为值填进去,path中就多了一个寻找执行命令的路径。
现在在任何目录下打开终端执行hugo version命令都应该能看到正常的版本号输出。
创建Github仓库
接下来就是创建一个仓库,这个仓库就是静态博客在Github上存放的地方。
点击屏幕右上角头像左边的加号,下拉菜单中点击New repository创建新仓库。
创建新仓库的时候,仓库名字是有讲究的,命名格式是username.github.io,例如我的用户名是ming102,仓库名就是ming102.github.io,如下图所示。
其他地方保持不动,然后点击Create repository按钮。
使用hugo创建新网站
找一个喜欢的目录,右键快捷方式打开Git bash here,在终端中输入下面的命令创建新网站。
hugo new site quickstart
这个quickstart就是网站所在的目录,cd到themes中
cd quickstart/themes
添加一个主题
git clone https://github.com/budparr/gohugo-theme-ananke.git
然后编辑网站目录里的config.toml文件,这个配置文件描述的网站的行为,主题就是在这里配置的,添加theme = "gohugo-theme-ananke"
让刚刚下载的主题生效。
在网站目录,在终端中执行下面的命令本地看看效果。
hugo server -D
很迅速地启动了一个本地服务器,访问地址是http://localhost:1313
使用下面的命令会编译静态文件,默认情况下编译好的静态文件在public目录中。
hugo
推送public文件到github远程仓库
还记得前面创建github远程仓库成功后的页面吗,这里就是指导怎么推送本地仓库到远程仓库的。
在publish文件夹中打开终端,输入下面的命令初始化本地仓库。
git init
输入下面的命令提交文件
git add .
git commit -m ‘my blog’
注意这是两行命令,第一行是添加缓存,第二行是提交到版本库,这是Git版本管理的机制,如果想深入了解请查看Git教程。
然后是关联本地仓库到远程的Github仓库,我的例子输入下面的命令。
git remote add origin https://github.com/ming102/ming102.github.io.git
然后把提交推送到远程仓库
git push -u origin master
细心的朋友可能发现了,截图里的origin后面跟着的是main,这是因为git默认创建的分支是master,github的截图里给这个分支重命名了main,我没有重命名分支,所以还是master。
这里推送的时候可能会遇到推送的权限问题,解决办法有两个:
1、配置SSH key
配置SSH key对单用户单网站是最方便的方式。
首先生成ssh key,可以参考这篇文章,生成git ssh key
然后在github右上角用户那里点击下拉菜单,点击settings,来到设置页面
在设置页面中点击SSH and GPG keys,然后点击New SSH key
把上一步生成的ssh key的公钥填进下面的表单中,生成的文件在用户目录的.ssh中,比如我的就在C:\Users\Leon\.ssh
,用编辑器打开id_rsa.pub,复制里面的内容到表单中的key中,title可以随便取个名字。
2、生成Github访问token
这种方式对多账户比较适合。
同样是在右上角的用户中打开settings页面
然后点击左侧的Developer settings。
然后点击Personal access tokens创建token
点击Generate new token.
给token设置一个名字
设置一些权限
点击Generate token
复制下来这个token
然后在本地git仓库中打开.git/config,修改下面的一行
把url修改成这样的格式:
https://youruser:password@github.com/user/repo.git
其中yourser就是用户名,password就是刚刚生成的token。
解析域名到github
首先在终端中ping一下github分配的域名的ip地址
然后要注册一个域名。
这里以Namesilo为例,这个域名服务商历史比较久了,我用的比较多,价格还算便宜,免费赠送whois域名保护,这点非常棒。
如果购买域名可以使用我的优惠码:infoliquify,会有1刀的优惠,点击下面的图片可以注册账号。
Namesilo的界面是丑了点,但不妨碍操作,买完域名后在Manage My Domains里可以进行域名解析。
找到域名,点击蓝色的地球图标进行解析
然后添加一个A记录指向刚刚得到的IP,所以记录就是下图的样子.
等待一段时间之后,域名解析就会成功
最后在github上做些配置,进入仓库的settings,找到github pages,如下图所示配置下域名
Enforce HTTPS勾选上,可以支持https。
至此,所有步骤都做完了,如果有任何问题,欢迎留言交流讨论。
欢迎转载,请注明出处:闪电树熊 » 如何用hugo在Github上搭建静态博客,并使用自定义域名