Dec 15, 2019

使用 Hugo 发布文章

摘要

  • 添加一篇文章
  • 本地开启草稿箱视图
  • 解除文章草稿状态
  • 发布草稿文章
  • 设置文章过期时间/发布时间
  • 发布保留过期文章及未发布文章

添加一篇文章

在上一篇文章 使用 Hugo 创建个人 Blog 中介绍了 Hugo 这个工具，以及如何使用它为自己创建一个好看的博客。这篇文章延续上一篇使用 registerforxxx.github.io 作为案例。

添加文章前我们先启动 Hugo

github.io $ hugo server

添加文章依旧是使用 new 子命令，这里我们在 posts 目录下创建一篇名为 my-first-post

github.io $ hugo new posts/my-first-post.md

创建完成后打开文章可以看到如下内容：

---
title: "My First Post" 
date: 2019-12-16T21:38:04+08:00
draft: true
tags:
  - untagged
---

这是一篇 Markdown 格式的文章，文章的开头由前后 --- 包裹了一些信息，这些信息称为文章的元数据，用于说明文章的相关配套信息，其中包括但不限于标题、日期、标签、是否草稿等。

这里对上述的元数据做解释如下：

  • title: 文章的标题
  • date: 文章的日期
  • draft: 文章是否草稿，草稿内容不会被发布
  • tags: 为当前文章打标签，不同文章可以使用相同的标签

文章内容需要写在元数据的后面：

---
title: "My First Post"
date: 2019-12-16T21:38:04+08:00
draft: true
tags: 
  - untagged
---

Quisque velit nisi, pretium ut lacinia in, elementum id enim. Vivamus suscipit tortor eget felis porttitor 
volutpat. Donec rutrum congue leo eget malesuada. Nulla porttitor accumsan tincidunt. Praesent sapien 
massa, convallis a pellentesque nec, egestas non nisi. Curabitur arcu erat, accumsan id imperdiet et, 
porttitor at sem. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Vivamus magna justo,
lacinia eget consectetur sed, convallis at tellus. Pellentesque in ipsum id orci porta dapibus. Vivamus 
magna justo, lacinia eget consectetur sed, convallis at tellus. 

Quisque velit nisi, pretium ut lacinia in, elementum id enim. Vivamus suscipit tortor eget felis porttitor 
volutpat. Donec rutrum congue leo eget malesuada. Nulla porttitor accumsan tincidunt. Praesent sapien 
massa, convallis a pellentesque nec, egestas non nisi. Curabitur arcu erat, accumsan id imperdiet et, 
porttitor at sem. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Vivamus magna justo,
lacinia eget consectetur sed, convallis at tellus. Pellentesque in ipsum id orci porta dapibus. Vivamus 
magna justo, lacinia eget consectetur sed, convallis at tellus.

完成文章的编写后我们回到浏览器，发现并没有看到新加的文章，即使刷新几百次也是一样的效果，这是因为文章仍处于草稿箱状态。如下图：

image-20191218190656155

本地开启草稿箱视图

记得我们上一篇文章的 Hugo 的特色 部分有提到 Hugo 具有默认热加载的功能，新添加的文章会自动在网页上实时渲染，但是！但是！但是！不包括草稿内容！

通过 hugo new 命令创建的文章默认会被打上草稿状态的tag 即 draft 选项，Hugo 通过 draft 选项识别到这是一篇草稿内容，所以不会对其进行渲染。

如果我们想在本地查看草稿内容，只需要在启动 Hugo 的时候带上参数 -D或则 --buildDrafts ：

github.io $ hugo server -D

回到浏览器：

image-20191216215029610

解除文章草稿状态

在正式发布文章前我们需要解除当前文章的草稿状态，解除草稿状态只需要把文章开头的 draft 选项去除即可。

发布草稿文章

如果需要将草稿内容进行发布，在执行 hugo 生成发布内容时附带 -D 或则 --buildDrafts 即可。

github.io $ hugo -D

设置文章过期时间/发布时间

Hugo 通过以下两个元数据选项提供文章的过期时间及发布时间（已发布的可以通过 URL 间接访问😂）：

  • expiryDate：过期时间，已过期的内容不会渲染到网页中
  • publishDate：发布时间，未到发布时间不会渲染到网页中
---
title: "孔融"
date: 2019-12-16T21:38:04+08:00
expiryDate: 2019-12-18T21:00:20+08:00
description: "孔融何许人也"
---

发布保留过期文章及未发布文章

直接执行 hugo 生成的发布内容不会携带已过期的文章或者未到发布时间的文章.

需要发布时携带过期文章需要执行时附带参数 -E 或则 --buildExpired：

github.io $ hugo -E

需要发布时携带未发布文章需要执行时附带参数 -F 或则 --buildFuture：

github.io $ hugo -F

当然也可以选择同时附带两个以上的参数：

github.io $ hugo -DEF

生成发布文件完成后推送最新内容到 GitHub 上即可看到最新的文章。

tangzixiang