hugo

我用过的静态博客有hexo、jekyll和hugo,对比起来,hugo虽然没有hexo那样丰富的插件和主题,但是hugo生成文章的速度更快。我是一名go语言爱好者,而hugo是go语言开发的, jekyll是用ruby开发的。于是我选择了hugo。下面我把hugo的安装步骤记录下来,供后来者参考。

环境

  • mac
  • brew
  • hugo

安装brew

/bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)"
$ brew update

选择中科大源

安装hugo

$ brew install hugo

使用

新建站点

$ hugo new site myblog
$ cd myblog

新建一个页面

$ hugo new about.md

开始服务

$ hugo server --buildDrafts

主题

我使用的主题是hugo-theme-stack 安装主题

git 

部署到Github个人页面

  • 在Github创建一个仓库,例如名字叫blog,可以是私有的,这个仓库用来存放网站内容和源文件
  • 再创建一个名称为.github.io的仓库,username为GitHub用户名,这个仓库用于存放最终发布的网站内容 进入本地网站目录
$ cd <YOUR PROJECT>

关联远程blog仓库

$ git remote add origin git@github.com:jeshs/blog.git

将本地网站全部内容推送到远程blog仓库

$ git push -u origin master

关闭本地Hugo服务器Ctrl+C,然后删除本地网站目录下的public文件夹,创建public子模块,注意下面是一行命令,不是两行

$ git submodule add -b master git@github.com:<USERNAME>/<USERNAME>.github.io.git public

然后就可以执行hugo命令,此命令会自动将网站静态内容生成到public文件夹,然后提交到远程blog仓库

hugo
cd public
git status
git add .
git commit -m "first commit"
git push -u orgin master

过一会就可以打开.github.io查看网站了 注意:本地网站是关联的blog仓库,本地网站下的public文件夹是以子模块的形式关联的github.io仓库,他们是相对独立的

自动部署脚本

将以上步骤添加到自动执行脚本中deploy.sh,脚本commit提交信息会使用执行时的时间,将脚本放到网站项目路径下,写完博客后,双击运行即可自动部署发布

#!/bin/bash

echo -e "\033[0;32mDeploying updates to GitHub...\033[0m"

# Build the project.
hugo # if using a theme, replace with `hugo -t <YOURTHEME>`

# Go To Public folder
cd public
# Add changes to git.
git add .

# Commit changes.
msg="rebuilding site `date`"
if [ $# -eq 1 ]
  then msg="$1"
fi
git commit -m "$msg"

# Push source and build repos.
git push origin master

# Come Back up to the Project Root
cd ..

评论系统

配置 utteranc评论,教程参考 https://utteranc.es/

路由配置

假设站点的一个[块sections][]名为post, 您想基于年份、月份和文章标题来构建规范化的路径,可以像下面相应的TOML的配置中一样来设置:

## 路由
[permalinks]
  post = "/:year/:month/:filename/"

对于标签分类的永久链接也可以如此配置,使用标签的复数形式而不是使用标签块。可能仅仅需要配置:slug 或者 :title 永久链接配置的值:

  • :year: the 4-digit year 4位数年份
  • :month: the 2-digit month 2位数月份
  • :monthname: the name of the month 月份的名称
  • :day the 2-digit day 两位数的月份内日期
  • :weekday the 1-digit day of the week (Sunday = 0) 1位的星期几(周日是0)
  • :weekdayname the name of the day of the week 星期几的名称
  • :yearday the 1- to 3-digit day of the year 1到3位数的年份内日期序数
  • :section the content’s section 内容块名称
  • :sections the content’s sections hierarchy 内容块的层级
  • :title the content’s title 内容的title
  • :slug the content’s slug (or title if no slug is provided in the front matter) 内容的slug(或者是title,如果没有在前言设定中提供slug)
  • :filename the content’s filename (without extension) 内容的文件名(不包含扩展名)

另外,用:作为前缀的Go语言的时间模式字符串可以使用

归档消除0001

我是用的是飞雪的主题

复制主题下的themes/maupassant/layouts/archives/single.html文件 ,放到博客目录下layouts/archives/single.html, 并修改为如下内容:

{{ define "content"}}
<div class="post-archive">
    {{ range (where (where .Site.Pages "Type" "in" (slice "post" "posts")) "Kind" "page").GroupByDate "2006" }}
        {{if ne .Key "0001"}} 
        <h2>{{ .Key }}</h2>
        <ul class="listing">
            {{ range .Pages }}
            <li>
                <span class="date">{{ .Date.Format "2006/01/02" }}</span>
                <a href="{{ .Permalink }}" title="{{ .Title }}">{{ .Title }}</a>
            </li>
            {{ end }}
        </ul>
        {{ end }}
    {{ end }}


</div>
{{ end }}

其实一般不会出现0001的情况,如果出现了,经检查文件中是否有格式不正确的地方,比如,我检查了下,我public/目录下生成了 1/01/except/index.html, 所以我检查了下我的 except.md文件,然后发现,文件头部少了 ---, 无意中删除了一行,补上后,执行hugo指令,重新生成 public文件,则发现没有这些文件,并且归档路径下也没有0001了。

--完--