Hugo 主题常用的代码片段

Apr 1, 2020 · 2 min read ·

Overview

全站 Site

网址：.Site.BaseURL

标题：.Site.Title，示例：

1<a href="{{ $.Site.BaseURL }}">{{ $.Site.Title }}</a>

副标题：.Site.Params.description

关键词：.Site.Params.keywords

头部菜单：

1{{ range $.Site.Menus.main }}
2	<li><a href="{{ .URL }}">{{ .Name }}</a></li>
3{{ end }}

config.toml配置示例：

 1baseURL  =  "https://flynx.dev"
 2title  =  "飞天"
 3[params]
 4	description = "不问明天，悠然浪费"
 5	keywords = "博客、主题、折腾、生活"
 6[menu]
 7	[[menu.main]]
 8		name="首页"
 9		url="/"
10		weight="1"
11	[[menu.main]]
12		name="关于"
13		url="/about"
14		weight="2"

全站标签列表及文章数量：

1{{- range $name, $taxonomy := .Site.Taxonomies.tags -}}
2	<a href="/tags/{{ $name | urlize }}">#{{ $name }}<small>({{ .Count }})</small></a>
3{{- end -}}

全站文章数：

1共 {{ len (where .Site.RegularPages "Section" "posts") }} 篇日志

文章列表 List

文章摘要：.Summary 文章列表会显示  前的内容或自动截断。

1{{ .Summary | plainify }}

config.toml配置阶段字符，默认 70 个：

1summaryLength = 140

截断判断：.Truncated 如果有 more 标签，则 true，显示“阅读全文”字样。

指定 content/posts 为文章内容，且自动截断：

 1{{  $paginator := .Paginate (where .Site.RegularPages "Type" "posts") }}
 2{{ range $paginator.Pages }}
 3<article class="post">
 4  <h1 class="post-title"><a href="{{ .Permalink }}">{{ .Title }}</a></h1>
 5  <time class="post-date">{{ .Date.Format "2006-01-02T15:04:05" }}</time>
 6  <div class="post-content">
 7 	 {{ .Summary }}
 8   </div>
 9  {{ if .Truncated }}
10  <div class="read-more">
11    <a href="{{ .Permalink }}">阅读全文…</a>
12  </div>
13  {{ end }}
14</article>
15{{- end }}

神奇的日期格式化："2006-01-02 15:04:05" 表示显示年月日时分秒

文章列表分页：

1<div class="pagination">
2  {{ if .Paginator.HasPrev }}
3    <a href="{{ .Paginator.Prev.URL }}">上一页</a>
4  {{ end }}
5  {{ if .Paginator.HasNext }}
6    <a href="{{ .Paginator.Next.URL }}">下一页</a>
7  {{ end }}
8</div>

文章 Single

标题、链接、时间，同上。

全文内容：.Content

文字数：.WordCount，配合config.toml中文统计更准确：

1hasCJKLanguage = true

阅读时间：.ReadingTime，示例：

1约{{ .ReadingTime }}分钟读完

分类 .Params.categories 标签 .Params.tags，示例：

1{{ if .Params.tags }}
2	<span class="post-tags">
3	{{ range .Params.tags }}
4		#<a href="{{ (urlize (printf "tags/%s" . )) | absURL }}/">{{ . }}</a>&nbsp;
5	{{ end }}
6	</span>
7{{ end }}

上、下文章链接标题，示例：

1<div class="pagination">
2	{{ if .NextInSection }}
3		<a href="{{ .NextInSection.Permalink }}">{{ .NextInSection.Title }}</a>
4	{{ end }}
5	{{ if .PrevInSection }}
6		<a href="{{ .PrevInSection.Permalink }}">{{ .PrevInSection.Title }}</a>
7	{{ end }}
8</div>

其他片段

当前年份，示例：{{ now.Year }}

页面类型：{{ .Section }}

首页判断：

1{{ if .IsHome }}
2	……
3{{ end }}

1{{ if not .IsHome }}……{{ end }}

定义变量：

1{{ $address := "123 Main St." }}
2{{ $address }}

定义模块，如 layouts/_default/baseof.html

1{{ block "main" . }}
2{{ end }}

layouts/_default/list.html

1{{ define "main" }}
2  ……
3{{ end }}

短代码 Shortcodes

LoveIt 主题内置数十种短代码：https://hugoloveit.com/zh-cn/theme-documentation-shortcodes/

未完

待更…… 🤷‍♂️