你想建立一个博客来分享你使用各种软件框架的最新冒险经历吗？你喜欢一个文档不完善的项目并想修复它吗？或者你只是想创建一个个人网站？
许多想开始写博客的人都有一个重要的顾虑：缺乏内容管理系统 (CMS) 的知识或学习的时间。那么，如果我说你不需要花几天时间学习一个新的 CMS、设置一个基本的网站、设计它的样式以及加强它以防止攻击者呢？如果我说你可以用 Hugo 在 30 分钟内从头到尾创建一个博客呢？
opensource.com
Hugo 是用 Go 编写的静态站点生成器。你可能会问，为什么要使用 Hugo？
- 因为没有数据库，没有需要任何权限的插件，也没有在你的服务器上运行的底层平台，所以没有增加安全问题。
- 该博客是一组静态网站，这意味着闪电般的响应时间。此外，所有页面都在部署时呈现，因此你的服务器负载很小。
- 版本控制很容易。一些 CMS 平台使用自己的版本控制系统 (VCS) 或将 Git 集成到其界面中。使用 Hugo，你的所有源文件都可以原生存在于你选择的 VCS 上。
坦率地说，Hugo 的目的是让编写网站再次变得有趣。让我们计时 30 分钟，好吗？
第 0-5 分钟：下载 Hugo 并生成一个站点
为了简化 Hugo 的安装，请下载二进制文件。要做到这一点
- 下载适合你操作系统的 压缩包。
- 将压缩包解压到你选择的目录中，例如
C:\hugo_dir或~/hugo_dir；此路径将称为${HUGO_HOME}。 - 打开命令行并切换到你的目录：
cd ${HUGO_HOME}。 - 验证 Hugo 是否正常工作
- 在 Unix 上：
${HUGO_HOME}/[hugo version] - 在 Windows 上：
${HUGO_HOME}\[hugo.exe version]
例如，c:\hugo_dir\hugo version。
为了简单起见，我将把 Hugo 二进制文件的路径（包括二进制文件）称为
hugo。例如，hugo version将在你的计算机上转换为C:\hugo_dir\hugo version。如果收到错误消息，则可能下载了错误的版本。另请注意，安装 Hugo 有许多可能的方法。有关更多信息，请参阅官方文档。理想情况下，您将 Hugo 二进制文件放在 PATH 上。对于这个快速入门，使用 Hugo 二进制文件的完整路径就可以了。
- 在 Unix 上：
- 创建一个新站点，它将成为你的博客：
hugo new site awesome-blog。 - 切换到新创建的目录：
cd awesome-blog。
恭喜！你刚刚创建了你的新博客。
第 5-10 分钟：为你的博客设置主题
使用 Hugo，你可以自己为你的博客设置主题，也可以使用现成的精美 主题 之一。我选择了 Kiera，因为它非常简单。要安装主题
- 切换到 themes 目录：
cd themes。 - 克隆你的主题：
git clone https://github.com/avianto/hugo-kiera kiera。如果你没有安装 Git- 从 GitHub 下载 .zip 文件。
- 将其解压到站点的
themes目录。 - 将目录从
hugo-kiera-master重命名为kiera。
- 将目录更改为 awesome-blog 级别：
cd awesome-blog。 - 激活主题。主题（包括 Kiera）通常带有一个名为
exampleSite的目录，其中包含示例内容和示例设置文件。要激活 Kiera，请将提供的config.toml文件复制到你的博客- 在 Unix 上：
cp themes/kiera/exampleSite/config.toml . - 在 Windows 上：
copy themes\kiera\exampleSite\config.toml . - 确认
Yes以覆盖旧的config.toml
- 在 Unix 上：
- （可选）你可以启动你的服务器以直观地验证主题是否已激活：
hugo server -D并在你的 Web 浏览器中访问http://localhost:1313。查看你的博客后，你可以通过在命令行中按Ctrl+C来关闭服务器。你的博客是空的，但我们正在取得进展。它应该看起来像这样
opensource.com
你刚刚为你的博客设置了主题！你可以在官方 Hugo themes 网站上找到数百个精美主题。
第 10-20 分钟：向你的博客添加内容
碗在空的时候最有用，但博客并非如此。在这一步中，你将向你的博客添加内容。Hugo 和 Kiera 主题简化了这一过程。要添加你的第一篇文章
- 文章原型是你内容的模板。
- 将主题原型添加到你的博客站点
- 在 Unix 上：
cp themes/kiera/archetypes/* archetypes/ - 在 Windows 上：
copy themes\kiera\archetypes\* archetypes\ - 确认
Yes以覆盖default.md原型
- 在 Unix 上：
- 为你的博客文章创建一个新目录
- 在 Unix 上：
mkdir content/posts - 在 Windows 上：
mkdir content\posts
- 在 Unix 上：
- 使用 Hugo 生成你的文章
- 在 Unix 上：
hugo new posts/first-post.md - 在 Windows 上：
hugo new posts\first-post.md
- 在 Unix 上：
- 在你选择的文本编辑器中打开新文章
- 在 Unix 上：
gedit content/posts/first-post.md - 在 Windows 上：
notepad content\posts\first-post.md
- 在 Unix 上：
此时，你可以尽情发挥。请注意，你的文章由两个部分组成。第一部分由 +++ 分隔。它包含关于你的文章的元数据，例如它的标题。在 Hugo 中，这被称为前置元数据。在前置元数据之后，文章开始。创建第一篇文章
+++
title = "First Post"
date = 2018-03-03T13:23:10+01:00
draft = false
tags = ["Getting started"]
categories = []
+++
Hello Hugo world! No more excuses for having no blog or documentation now!你现在需要做的就是启动服务器：hugo server -D。打开你的浏览器并输入：http://localhost:1313/。
opensource.com
第 20-30 分钟：调整你的站点
我们所做的事情很棒，但仍然有一些小问题需要解决。例如，命名你的站点很简单
- 通过在命令行中按
Ctrl+C来停止你的服务器。 - 打开
config.toml并编辑设置，例如博客的标题、版权、名称、你的社交网络链接等。
当你再次启动你的服务器时，你会看到你的博客有更多的个性化。还缺少一个基本的东西：菜单。这也是一个快速修复。回到 config.toml，在底部插入以下内容
[[menu.main]]
name = "Home" #Name in the navigation bar
weight = 10 #The larger the weight, the more on the right this item will be
url = "/" #URL address
[[menu.main]]
name = "Posts"
weight = 20
url = "/posts/"这会为 Home 和 Posts 添加菜单。你仍然需要一个 About 页面。不要从 config.toml 文件中引用它，而是从 markdown 文件中引用它
- 创建一个 About 文件：
hugo new about.md。请注意它是about.md，而不是posts/about.md。About 页面不是一篇博客文章，所以你不想让它显示在 Posts 部分。 - 在文本编辑器中打开该文件并输入以下内容
+++
title = "About"
date = 2018-03-03T13:50:49+01:00
menu = "main" #Display this page on the nav menu
weight = "30" #Right-most nav item
meta = "false" #Do not display tags or categories
+++
> Waves are the practice of the water. Shunryu Suzuki当你启动你的 Hugo 服务器并打开 http://localhost:1313/ 时，你应该看到你的新博客已准备好使用。（在我的 GitHub 页面上查看 我的示例。）如果你想改变菜单项的活动样式以使填充更漂亮一点（如 GitHub 实时版本），将 这个补丁 应用到你的 themes/kiera/static/css/styles.css 文件。
10 条评论