HUGO

  • 新闻
  • 文档
  • 主题
  • 作品展示
  • 社区
  • GitHub
    • English
    • 中文

What's on this Page

  • Base Template Lookup Order
  • Define the Base Template
  • Override the Base Template
TEMPLATES FUNDAMENTALS

基本模板和模块

The base and block constructs allow you to define the outer shell of your master templates (i.e., the chrome of the page).

The block keyword allows you to define the outer shell of your pages’ one or more master template(s) and then fill in or override portions as necessary.

Base Template Lookup Order

Since Hugo v0.63, the base template lookup order closely follows that of the template is applies to (e.g. _default/list.html).

See Template Lookup Order for details and examples.

Define the Base Template

The following defines a simple base template at _default/baseof.html. As a default template, it is the shell from which all your pages will be rendered unless you specify another *baseof.html closer to the beginning of the lookup order.

layouts/_default/baseof.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>{{ block "title" . }}
      <!-- Blocks may include default content. -->
      {{ .Site.Title }}
    {{ end }}</title>
  </head>
  <body>
    <!-- Code that all your templates share, like a header -->
    {{ block "main" . }}
      <!-- The part of the page that begins to differ between templates -->
    {{ end }}
    {{ block "footer" . }}
    <!-- More shared code, perhaps a footer but that can be overridden if need be in  -->
    {{ end }}
  </body>
</html>

Override the Base Template

From the above base template, you can define a default list template. The default list template will inherit all of the code defined above and can then implement its own "main" block from:

layouts/_default/list.html

{{ define "main" }}
  <h1>Posts</h1>
  {{ range .Pages }}
    <article>
      <h2>{{ .Title }}</h2>
      {{ .Content }}
    </article>
  {{ end }}
{{ end }}

This replaces the contents of our (basically empty) “main” block with something useful for the list template. In this case, we didn’t define a "title" block, so the contents from our base template remain unchanged in lists.

Code that you put outside the block definitions can break your layout. This even includes HTML comments. For example:

<!-- Seemingly harmless HTML comment..that will break your layout at build -->
{{ define "main" }}
...your code here
{{ end }}

See this thread from the Hugo discussion forums.

The following shows how you can override both the "main" and "title" block areas from the base template with code unique to your default single page template:

layouts/_default/single.html

{{ define "title" }}
  <!-- This will override the default value set in baseof.html; i.e., "{{.Site.Title}}" in the original example-->
  {{ .Title }} &ndash; {{ .Site.Title }}
{{ end }}
{{ define "main" }}
  <h1>{{ .Title }}</h1>
  {{ .Content }}
{{ end }}

See Also

  • path.Base
  • 关于 Hugo
    • 概述
    • Hugo的安全模型
    • Hugo and GDPR
    • 什么是Hugo
    • Hugo 特征
    • 静态的好处
    • 证书
  • 入门
    • 入门概述
    • 快速开始
    • 安装 Hugo
    • 基本用法
    • 目录结构
    • 配置
    • 外部学习资源
  • Hugo 模块
    • Hugo 模块概述
    • 配置模块
    • 使用Hugo模块
    • 主题组件
  • 内容管理
    • 内容管理概述
    • 组织
    • 捆绑页
    • 内容格式
    • 前面的问题
    • 构建选项
    • 网页资源
    • 图像处理
    • 简码
    • 相关内容
    • 章节
    • 内容类型
    • 原型
    • 分类
    • 摘要
    • 链接和交叉引用
    • URL管理
    • 菜单
    • 目录
    • 静态文件
    • 注释
    • 多种语言 和 国际化
    • 语法高亮
  • 模板
    • 模板概述
    • 介绍
    • 模板查找顺序
    • 自定义输出格式
    • 基本模板和模块
    • 列表页面模板
    • 首页模板
    • 章节模板
    • 分类模板
    • 单页模板
    • 内容视图模板
    • 数据模板
    • 部件模板
    • 简码模板
    • 本地文件模板
    • 404页
    • 菜单模板
    • 分页
    • RSS 模板
    • 网站地图模板
    • Robots.txt
    • 内置模板
    • 另类模板
    • 模板调试
  • 函数
    • 函数快速参考
    • .AddDate
    • .Format
    • .Get
    • .GetPage
    • .HasMenuCurrent
    • .IsMenuCurrent
    • .Param
    • .Render
    • .RenderString
    • .Scratch
    • .Unix
    • absLangURL
    • absURL
    • after
    • anchorize
    • append
    • apply
    • base64
    • chomp
    • complement
    • cond
    • countrunes
    • countwords
    • dateFormat
    • default
    • delimit
    • dict
    • echoParam
    • emojify
    • eq
    • errorf and warnf
    • fileExists
    • findRE
    • first
    • float
    • ge
    • getenv
    • group
    • gt
    • hasPrefix
    • highlight
    • htmlEscape
    • htmlUnescape
    • hugo
    • humanize
    • i18n
    • in
    • index
    • int
    • intersect
    • isset
    • jsonify
    • lang.Merge
    • lang.NumFmt
    • last
    • le
    • lower
    • lt
    • markdownify
    • Math
    • md5
    • merge
    • ne
    • now
    • os.Stat
    • partialCached
    • path.Base
    • path.Dir
    • path.Ext
    • path.Join
    • path.Split
    • plainify
    • pluralize
    • print
    • printf
    • println
    • querify
    • range
    • readDir
    • readFile
    • ref
    • reflect.IsMap
    • reflect.IsSlice
    • relLangURL
    • relref
    • relURL
    • replace
    • replaceRE
    • safeCSS
    • safeHTML
    • safeHTMLAttr
    • safeJS
    • safeURL
    • seq
    • sha
    • shuffle
    • singularize
    • slice
    • slicestr
    • sort
    • split
    • string
    • strings.HasSuffix
    • strings.Repeat
    • strings.RuneCount
    • strings.TrimLeft
    • strings.TrimPrefix
    • strings.TrimRight
    • strings.TrimSuffix
    • substr
    • symdiff
    • templates.Exists
    • time
    • title
    • transform.Unmarshal
    • trim
    • truncate
    • union
    • uniq
    • upper
    • urlize
    • urls.Parse
    • where
    • with
    • 图片函数
  • 变量
    • 变量概述
    • 网站变量
    • 简码变量
    • 页面变量
    • 页面方法
    • 分类变量
    • 文件变量
    • 菜单项属性
    • Hugo 变量
    • Git的变量
    • 网站地图变量
  • Hugo 管道
    • Hugo 管道概述
    • Hugo 管道简介
    • SASS / SCSS
    • PostCSS
    • 资产压缩
    • Asset 捆绑
    • 指纹和SRI
    • 来自模板资源
    • 从字符串资源
  • CLI
  • 故障排除
    • 疑难解答
    • FAQ
    • 构建性能
  • 工具
    • 开发工具概述
    • 迁移
    • 入门套件
    • 前端
    • 编辑器插件
    • 搜索
    • 其他的项目
  • 托管和部署
    • 托管和部署概述
    • Hugo 部署
    • 使用Nanobox的主机无关部署
    • AWS Amplify托管
    • Netlify托管
    • Render托管
    • Firebase托管
    • GitHub托管
    • GitLab托管
    • KeyCDN托管
    • Bitbucket托管
    • 使用Wercker部署
    • 使用rsync部署
  • 贡献
    • 贡献Hugo
    • 开发
    • 文档
    • 主题
  • 保养
“基本模板和模块” was last updated: March 24, 2020: 翻译 (91f26d0)
Improve this page
By the Hugo Authors
Hugo Logo
  • File an Issue
  • Get Help
  • Discuss Source Code
  • @GoHugoIO
  • @spf13
  • @bepsays

Netlify badge

 
 

Hugo Sponsors

Logo for Forestry.io
Logo for Linode
Logo for eSolia
 

The Hugo logos are copyright © Steve Francia 2013–2020.

The Hugo Gopher is based on an original work by Renée French.

  • 新闻
  • 文档
  • 主题
  • 作品展示
  • 社区
  • GitHub
  • 关于 Hugo
  • 入门
  • Hugo 模块
  • 内容管理
  • 模板
  • 函数
  • 变量
  • Hugo 管道
  • CLI
  • 故障排除
  • 工具
  • 托管和部署
  • 贡献
  • 保养