个人博客hugo
中文帮助
主题 hueman https://demo-hueman.presscustomizr.com/demo/layouts/boxed/#
如果需要更新所有Hugo的依赖库,增加 -u 参数:
$ go get -u -v github.com/spf13/hugo
hugo new site path/sitename 新建一个站点
hugo new post/good-to-great.md 添加到content/post 目录
hugo server 启动server
hugo server --buildDrafts 预览草稿
hugo undraft content/post/good-to-great.md 发布一篇文章
hugo server --theme=hugo_zen 以zen 主题启动server
hugo --theme=hugo_zen 以zen 主题生成草稿
hugo new post/first.md
常见问题
It's very terrible to have urls encoded with percents for SEO reasons at least.
Could you implement an option to disable such behaviour?
I found workaround to disable encoding/escaping of urls that contain UTF-8 (non english) chars, e.g.
好看的主题
https://github.com/fi3ework/hexo-theme-archer
创建 themes 目录
$ cd themes
$ git clone https://github.com/spf13/hyde.git
github.com/laozhu/hugo-nuo
主题:
瀑布流风格 Zenithar/hugo-theme-bleak
卡片风格 ageekymonk/hugo-tracks-theme
Google 图片风格 aerohub/hugrid
博客 Vimux/Mainroad
简洁黑 yoshiharuyamashita/blackburn
网站风格 mmrath/hugo-bootstrap http://mmrath.com/
博客 nodejh/hugo-theme-cactus-plus:
博客 dim0627/hugo_theme_robust
appernetic/hugo-bootstrap-premium
官网 digitalcraftsman/hugo-creative-theme
官网 saey55/hugo-elate-theme
Beautiful static documentation for your API
神器DOCAPI bep/docuapi
WIKI ArchLinux syui/hugo-theme-arch
文档风格 Bootie Docs
文档风格 docDock
文档风格 key-amb/hugo-theme-bootie-docs:
文档风格 Swiftline
文档风格 Grav matcornic/hugo-theme-learn
文档风格 drone
全文搜索 lunr
go get github.com/arial7/hugo-golunr
##名词解释
Taxonomy 是用来展示内容之间逻辑关系的一种分类方法
--uglyURLs 增加
.html
后缀└── content └── about | └── _index.md // <- https://example.com/about/index.html ├── post | ├── firstpost.md // <- https://example.com/post/firstpost.html
section path slug url
path("/posts/my-first-hugo-post.md") ⊢-------------^------------⊣
baseURL url("/posts/my-first-hugo-post/")
⊢--------^--------⊣ ⊢------------^-------------⊣
baseurl section slug
⊢--------^--------⊣ ⊢-^-⊣ ⊢------^-------------⊣permalink
⊢----------------------^-----------------------⊣
https://example.com/posts/my-first-hugo-post/index.htmlpost 文章中 增加oldpost 重定向
+++
aliases = [
"/posts/my-old-url/",
"/2010/01/01/even-earlier-url.html"
]
+++
Content中的 section 和 type
section 和 type 的作用类似,都是在模板渲染时定义在 主题的layouts中的目录名,
Type 是和 Layout 进行关联
layout 在 是渲染时 lookup-order 具体的模板文件 layout.html
section
section是目录名字,也就是content/下面的 目录 名
type
- 默认: type是一直有值的,当有子目录时type就是目录名,当没有子目录时就是page
type 等于 section 的名字,这个是系统自动给设置的,当没有创建section时 就是 page
content/events/my-first-event.md 那么这里type就被设置为section的名字events
了
content/my-first-event.md 那么这里type就是page
了 - 自定义type名字
对hugo来说 section 是不能更改的,但是type我们可以在 front-matter 中修改type = "even"
- 在layout中使用
通过在
layouts/type_name/birthday.html
front-matter
#必填的
title:"文章的标题"
description:内容的描述
date:时间,一般的这个时间由hugo自己填写
taxonomies:分类术语的复数形式
#选填的
aliases:一个或者多个别名(数组),别名用于生成html路径。
draft: 草稿。如果设置为“f true”, 内容将不会发布,除非使用“–buildDrafts”参数。
# 新入门的经常看不到内容,都是这个“draft”的原因,建议直接删除。
publishdate :发布日期
type :内容的类型
isCJKLanguage :汉字编码(其实还包括日文韩语)。如果设置了,才能正确的使用汉字的自动摘要”.Summary “和字数统计” .WordCount”。
weight :权重,用于排序的一个数字。默认是从小到大的,可以是负数。
markup :标记 (试验性的)。默认是md,也可以是”rst“格式。rst是”reStructuredText“格式。
slug :小节。在url尾巴处出现的一个”token“。
url :从根目录开始的全部url。
模板
hugo的基本模板分为三种:详细页,列表页,首页。
详细页名称为single.html,用于对应单独一篇文章的输出。
列表页名称为list.html,用于一个栏目、类型、章节、日期等等归集的列表输出。列表页可以分页。
首页名称为index.html,用于导航列表页和详细页。单页面站点可以只有首页。
模板匹配规则
- 若有与文件类型(章节)相同文件名 的内容模板,则匹配和使用。
- 若没有,则匹配“ default.md ”。
- 若使用 主题 文件,则使用主题的“archetypes”,规则与全局的相同。
若都没有匹配的,则使用hugo自带的。
渲染规则
若hugo无themes文件夹,或themes下面没有主题,则使用根目录下的layouts、archetypes和static文件进行渲染。
若有主题文件并设置了主题,则使用主题文件渲染。
首页使用index.html渲染。
列表页使用_default下的list.html渲染。
详细页(对应单个的md文件)使用_default下的single.html渲染。
若设置了内容类型,则使用相应的“xxx”类型文件目录下的list和single.html渲染。
单页面站点需要index.html,首页index.html模板支持所有列表页和详细页的模板参数、函数。列表就是很多个的文章,单个就是单篇,hugo还有模板文件分割(比如头部共同文件)、视图、片段等概念,非常灵活方便,其实hugo的模板就是go模板,无奈谷歌被墙。好东西总是忍不住一枝红杏出墙来!
hugo单页模板匹配
以下是hugo的单页面模板匹配过程:
/layouts/类型 或 章节/LAYOUT.html
/layouts/类型 或 章节/single.html
/layouts/_default/single.html
/themes/主题/layouts/类型 或 章节/LAYOUT.html
/themes/主题/layouts/类型 或 章节/single.html
/themes/主题/layouts/_default/single.html
以上中文部分都是我们后面新建的主题、类型、章节。我们推荐使用主题,也就是后三个规则。
为了方便,我们直接修改默认新建主题生成的“/themes/hugao_theme/layouts/_default/ single.html ”单页面主题。
变量
{{- .Title -}} 移除前后空白字符 [ \t \r \n ]
config.yaml 站点级变量访问
.Site.Social
#Site变量首字母必须大写
.Site.Params.Links
[params.Links] 多级配置变量
youdao = "www.youdao.com"
baidu = "www.youdao.com"page级变量访问
.Params.tags
# front matter变量
.RelPermalink the relative permanent link for this page.
.RelRef
returns the relative permalink for a given reference (e.g., RelRef "sample.md"). .RelRef does not handle in-page fragments correctly. See Cross References.
.Section 当前文档所属的一级目录
.Title
.Truncated “Read more…”
.Type the content type of the content (e.g., post).
.URL全局变量访问 Use
$.
to Access the Global Context$.Site.Title
.File 变量 等价
.Source.File
访问目录结构
{{range .Site.Sections }}
{{ .Type | Title }} ## .Type关键 获取Section名称
{{end}}
如何访问所有的categories tags
{{range $k,$v := .Site.Taxonomies.categories}}
<option value="{{$k | humanize | lower}}">{{$k | humanize | lower}}</option>
{{end}}
{{ with .Site.Taxonomies.categories }}
<h1 class="headline">Categories</h1>
<section class="categories">
{{ range $name, $value := . }}
<h2 class="category">
<a href="{{ $baseurl }}categories/{{ $name | urlize }}">{{ title $name }}</a>
<small>({{ .Count }})</small>
</h2>
{{ end }}
</section>
{{ end }}
{{ with .Site.Taxonomies.tags }}
<h1 class="headline">Tags</h1>
<section class="tags">
{{ range $name, $value := . }}
<span class="tag">
<a href="{{ $baseurl }}tags/{{ $name | urlize }}">{{ $name }}</a>
<small>({{ .Count }})</small>
</span>
{{ end }}
</section>
{{ end }}