快速开始

快速进入hugo的世界

简介和官网说了很多hugo的好话。可是,您说好就好?大家好才是真的好!

盲人摸象

hugo究竟有多强大,多简单易用,试试不就知道了。不求全,只求简单快捷,强大呢,在后面的使用中您便会发现。

直接使用

按照官网的顺序,您必须安装和输入一堆命令才能使用,而本中文手册本着最简化的特点,打包了入门的一些文件,让您直接体验hugo之强大。

下载

百度网盘下载

这是一个 windows 64 为的hugo和搭建好的一个名为胡搞(hugao)的站点。下载后解压到C盘就可以了。

如果您的系统 不是windows 64位 的,您需要从官网下载对应版本的,覆盖“ hugo\bin\hugo.exe “文件。覆盖方法是在其他地方重命名,然后粘贴进去覆盖。

设置系统变量

以windows7为例:

右击计算机——属性——高级系统设置——环境变量;然后在系统变量(非用户变量)里面找到“path”为名的变量,点击编辑,在变量值的最后(不是覆盖!是最后)添加 “ ;C:\hugo\bin ” ,一路确定即可。

验证方法为:运行,CMD,hugo -h,出现一大堆文本就是对了。

体验hugo

在命令行里面输入

hugo server -w

打开浏览器,输入“ localhost:1313 “就可以看见“欢迎胡搞”几个大字了。

站点目录

hugo制作的站点有一个目录结构,这里做一个解释:

archetypes/ : 全局原型,也就是内容模板。
content/    :内容,存放“XXX.md”文件。
data/       :存放数据文件
layouts/    :全局样式,所谓全局,就是没使用主题的时候的样式
public/     :生成目录,所有的静态页面都在这里,上传服务器仅传这个就行。
static/     :静态目录,该目录中的文件会在生成的时候复制到public里面。比如图片、js、php脚本
themes/     :主题目录,一个站可有多个主题,就像换衣服
config.toml :站点配置文件,可以配置站点名字等等很多信息

做了什么

盲人摸象嘛,看见什么说什么了。

  • 首先我建立了一个hugo目录,并在里面建立了一个bin和site目录
  • bin存放下载下来的exe文件,并更名为hugo.exe
  • 为了不污染您的系统,环境变量由您自己设置
  • 使用“hugo new site hugao”命令建立了一个站点“hugao”
  • 使用“hugo new theme hugao_theme”命令建立了一个主题
  • 修改config.tom文件编码支持中文(UTF-8编码)
  • 修改config文件中Title值为“欢迎胡搞!”
  • 添加theme = “hugao_theme”到config文件中,表示默认使用“hugao_theme”主题
  • 修改themes\hugao_theme\layouts\index.html模板文件的编码支持中文
  • 在index.html模板中添加“{{.Title}}”输出config文件中设置的变量“Title”
  • 使用“hugo”命令生成的站点

到这里,就是您所下载到的文件的内容了

总结

hugo运行于命令行,当然,在linux系统里面更为方便,唯一做的事情是设置系统变量。经过测试,因为权限等原因,在其他盘的hugo可能会运行不良,所以放在C盘也无妨,记得备份就行。

hugo采用命令方式建站。别看它就一个exe文件,也没有界面,它用起来功能很强大,也很简洁,建立起来的站点有一个固定的目录结构。

hugo采用模板变量输出内容、控制输出。当然,在快速开始里面我们只适用了一个输出“ {{.Title}} ”。接触过dede等模板的同学是不是觉得似曾相识呢?是的,就是如您所想的,不同的是这个模板适用的是“go”语言的模板而非php模板。

hugo考虑到了很多您所需要的:

  • 简洁:一个exe就是一切,包括建立、更新、生成、模板、站点、主题、服务器等等。
  • 自由:受够了各种CMS的规则、约定、规范?hugo没有,他不强迫你做任何事情。
  • 周全:多主题、文件模板、模板嵌套、目录、搜索、迁移、您所需要的它都有或都将有。
  • 快速:生成的快速,浏览的更快速。
  • 为了:这些为了什么?为了让您有更多时间做其他的事,比如UI和内容,或者进入下一个项目。

本节是一个快速体验hugo的盲人摸象的愉快的旅程。你所做的仅仅是:

  • 下载我为您打包好的体验包
  • 修改系统的path变量
  • 运行“hugo server -w”命令

更多的安装配置及其他细节呢,看后面咯,摸着大象感觉下它好就行了,摸到的大象毕竟不是全部的hugo。