新手搭建Hogo静态博客教程(三):博客发布与个性化域名

本教程为系列文章,点击右下角的 #Hugo 可以查看全部。

在上一篇中,我们已经对博客进行了部分调整,实现了我们需要的功能,在这一篇中,我将会说一下如何把博客部署到网络中。

博客生成

在我查Hugo 早期的中文资料中,发现大家都没有说怎么生成 public 文件夹。现在我才想明白,早期的 hugo server 命令和 hugo命令会同时执行。

现在的话,hugo已经将这些命令分开了,hugo所有的命令在这里,其中生成静态博客的命令是第一个hugo

具体的执行参数在这里写了

我个人习惯于使用

hugo  --cleanDestinationDir

–cleanDestinationDir 这个命令参数会在生成静态博客的时候,清除部分用不上的static内容。

在网上查的时候,还有的人会用如下的命令

hugo -t casper

这个命令的含义是,使用casper主题(theme)对博客进行构建,由于现在已经在配置文件中设置构建主题了,不需要再指定一遍。

执行完之后,就会在根目录下看到一个public的文件夹,这个文件夹,就是网站所有的内容了。我们要做的就是把这个网站上传到网络。

博客发布

由于生成的内容,都是静态的html资源,只需要一个http服务器,就可以实现网站的功能了,可以选择自己建站,也可以选择其他方式。

当然多数人都会选择 Github Pages 的方式来进行博客发布。

方便、免费、舒服好用。

Hugo官网提供了所有的发布方式,我们以其中的 Github 为例,配置参考官网这里


先简单解释下Github Pages,这个东西就是用来简化个人或者是组织新建网站成本的。多数人都会选择用它做博客,在上一篇中,我也写出了github官方的规定。个人博客很难达到这个标准,就当作没有限制好了。

如果不使用 Github Pages 个人建站,用户需要面对很多的问题,比方说配置主机,配置服务器,配置安全内容,上传安全等问题需要解决。

使用的话,就可以抛开这些烦恼,快速建站。

在github官网给出了说明,在hugo官网也给出了同样的说明。

下面开始配置说明。

我个人github的username是angrydisk

  1. 在github网页上面,创建一个名为<username>.github.io仓库
  2. 回到本地,在public中初始化仓库,并把内容上传到刚刚创建的仓库中。执行的代码如下

    cd public
    git init
    git remote add origin git@github.com:angrydisk/angrydisk.github.io.git
    git add .
    git commit -m "Init commit"
    git push -u origin master
    

以上代码的作用是在public目录下,创建git仓库,并把代码推送到刚刚创建的remote仓库中。

官网的教程和我的还不太一样,他是告诉你创建2个仓库,一个仓库用于博客的代码,另一个仓库用于构建 Github Pages

稍等 Github Pages 构建一下,就可以通过 <username>.github.io 来访问自己的博客了。


如果觉得这样可以的话,就可以直接看下一篇了。

如果感觉github提供的域名不舒服,可以继续看如何配置域名,接下来会详细说说如何配置域名相关的内容。


想自定义域名的话需要以下几个步骤

  • 购买域名
  • 配置相关的dns
  • 修改blog相关内容

域名基础

在这部分,会说一些基础,进行内容铺垫。没有这些概念上的理解,接下来的配置会很困惑。

在我们访问的网址背后,都是一个一个的ip地址,早期人们也会用ip地址,后来人们觉得这个不行,一串数字非常不人性化。就出现了hosts文件,把普通的字符串和ip地址关联起来,这也就是本地的域名解析,或者说为dns。

网站越来越多之后,自己的域名解析不太够用了,就有了专门的dns服务商。后来怕全球的这个东西出乱子,又有了ICANN之类的机构,对相关内容进行负责。

为什么要购买的呢?购买域名,其实是购买一个dns解析的服务。我要是不买的话,没人能从zhaogaz.com找到我。只有我买了之后,在dns的服务器才能找到我的域名。

域名提供商也是按照规范来的,所以也不用担心这里能找到你的域名,换个地方就找不到了。dns服务器之间也会互相通知传递数据的。

当然你国这个地方会有些特殊(划掉)

顶级域名/一级域名:顶级域名指的是zhaogaz.combaidu.comgoogle.com这类域名。

二级域名:二级域名才是最常见的,比方说www.baidu.combooks.google.comangrydisk.github.io

whois:可以通过这个查询找到谁拥有xxx.com 的域名,因为有些人就是为了高价转让才购买域名的。

铺垫简单就说这些。接下来开始进行相关的配置。


域名购买

域名的话,在哪买都行,国内国外也都行,看个人爱好了。

不过国内会稍微复杂一点,因为需要备案啊,什么的。

主要看Blog面向哪里,如果Blog面向国内,在国内一站式解决比较方便。

我个人的话,想法不多,找便宜的买:-)

全球中比较知名的有 Godaddy、name等网站,国内的话,有阿里的万网、dnspod等。

我个人的ID是zhaogaz,在namesilo购买的,买的顶级域名是 zhaogaz.com

据说只有com结尾的域名最有价值,其他的像什么info啊,cc啊乱七八糟后缀虽然都可以买,都没有com好就是了。

购买的流程很简单,namesilo官网在这里

先在domain search中搜索想要的域名,然后网站会列出所有的域名,同时显示是否有人注册,价格如何。

然后一路下一步填写必要信息,支付宝付钱。

域名购买结束。

修改blog相关的内容

之前博客的配置文件config中,有一个选项,叫baseurl,这条配置,就可以写成目前我新买的域名,也就是做如下修改

baseurl = "http://zhaogaz.com"

一直保留原始的相对路径配置也可以。

baseurl = "/"

还是看需求,怎么做都可以,这个baseurl会影响网站的链接,只要所有网站资源能正常加载就行。如果需求特殊需要针对性修改。

我们既然想在Github Pages中设置个性化域名,就需要按照对应的要求去做。

第二步就是需要在static中放一个名为 CNAME 的文本文件,文本中写上自己买的域名。我的话直接写zhaogaz.com

注意:这个文本文件是Github Pages 的规范,CNAME必须大写,无txt后缀。

如果在github仓库的网页中做配置,效果一样。在仓库的setting页面,设置个性化域名,然后在仓库中也会生成一个CNAME文件。

static放了CNAME文件之后,需要重新生成静态资源,推送到git仓库中,推荐这种方式,要不然还要解决git冲突的问题。

到目前为止,blog这边的配置基本都做完了。接下来需要配置域名部分。

域名解析

以namesilo为例,进行操作。

进入Domain Manager页面,看到如下页面,点击右侧的地球图标

2018-02-21_120551

进入manage dns页面,该页面的下面提供了github 模版,可以直接套用

在CNAME 那行,修改ADDRESS/VALUE 把这个值改成自己的Github Pages 网址。我个人的话,改成了如下内容

2

这个配置是什么含义呢?

在我输入www.zhaogaz.com的时候,直接转跳到zhaogaz.com下,背后实际的链接地址是angrydisk.github.io

由于我在Github Pages中也做了配置,访问angrydisk.github.io的时候直接会转跳到zhaogaz.com下。

用户只需要知道 输入zhaogaz.com就能访问博客了。

dns的修改,并不会马上生效,需要等一下。

等生效之后,输入zhaogaz.com/www.zhaogaz.com都能正常访问到博客了。资源加载也没有问题。


本篇内容到这里就结束了。本篇主要说了如何发布博客,设置个性化域名,博客算是上线了。

但是实际使用中,仍然是很麻烦的事情,我需要敲好几条命令,才能写一篇文章,发布一篇文章更费力。

下一篇,将会说一说如何优化博客,简化日常使用成本。