HUGO

  • 新闻
  • 文档
  • 主题
  • 社区
  • GitHub
  • 关于 Hugo
    • In this section
    • Introduction
    • Features
    • Privacy
    • Security
    • License
  • 安装
    • In this section
    • macOS
    • Linux
    • Windows
    • BSD
  • 入门
    • In this section
    • Quick start
    • Basic usage
    • Directory structure
    • Configuration
    • Configure markup
    • Glossary of terms
    • External learning resources
  • Quick reference
    • In this section
    • Emojis
    • Functions
    • Methods
    • Page collections
  • 内容管理
    • In this section
    • Organization
    • Page bundles
    • Content formats
    • Front matter
    • Build options
    • Page resources
    • Image processing
    • Shortcodes
    • Related content
    • Sections
    • Content types
    • Archetypes
    • Taxonomies
    • Summaries
    • Links and cross references
    • URL management
    • Menus
    • Comments
    • Multilingual
    • Markdown attributes
    • Syntax highlighting
    • Diagrams
    • Mathematics
    • Data sources
    • Content adapters
  • 模板
    • In this section
    • Introduction
    • Template types
    • Lookup order
    • Base templates
    • Home templates
    • Single templates
    • Section templates
    • Taxonomy templates
    • Term templates
    • Partial templates
    • Content view templates
    • Shortcode templates
    • Sitemap templates
    • RSS templates
    • 404 templates
    • robots.txt templates
    • Menus
    • Pagination
    • Embedded templates
    • Custom output formats
  • 函数
    • In this section
    • cast
    • collections
    • compare
    • crypto
    • css
    • data
    • debug
    • diagrams
    • encoding
    • fmt
    • global
    • go template
    • hash
    • hugo
    • images
    • inflect
    • js
    • lang
    • math
    • openapi3
    • os
    • partials
    • path
    • reflect
    • resources
    • safe
    • strings
    • templates
    • time
    • transform
    • urls
  • 方法
    • In this section
    • Duration
    • Menu
    • Menu entry
    • Page
    • Pager
    • Pages
    • Resource
    • Shortcode
    • Site
    • Taxonomy
    • Time
  • Render hooks
    • In this section
    • Introduction
    • Blockquotes
    • Code blocks
    • Headings
    • Images
    • Links
    • Passthrough
    • Tables
  • Hugo Modules
    • In this section
    • Configure Hugo modules
    • Use Hugo Modules
    • Theme components
  • Hugo Pipes
    • In this section
    • Introduction
    • Transpile Sass to CSS
    • PostCSS
    • PostProcess
    • JavaScript building
    • Babel
    • Asset minification
    • Concatenating assets
    • Fingerprinting and SRI hashing
    • Resource from string
    • Resource from template
  • CLI
  • 故障排除
    • In this section
    • Audit
    • Logging
    • Inspection
    • Deprecation
    • Performance
    • FAQs
  • 开发工具
    • In this section
    • Editor plugins
    • Front-ends
    • Search
    • Migrations
    • Other projects
  • 托管 & 部署
    • In this section
    • Hugo Deploy
    • Deploy with Rclone
    • Deploy with Rsync
    • Host on 21YunBox
    • Host on AWS Amplify
    • Host on Azure Static Web Apps
    • Host on Cloudflare Pages
    • Host on Firebase
    • Host on GitHub Pages
    • Host on GitLab Pages
    • Host on KeyCDN
    • Host on Netlify
    • Host on Render
  • 贡献
    • In this section
    • Development
    • Documentation
    • Themes
  • Maintenance
RENDER HOOKS

Table render hooks

Create a table render hook to override the rendering of Markdown tables to HTML.
New in v0.134.0

Context

Table render hook templates receive the following context:

Attributes

(map) The Markdown attributes, available if you configure your site as follows:

hugo.
     
markup:
  goldmark:
    parser:
      attribute:
        block: true
[markup]
  [markup.goldmark]
    [markup.goldmark.parser]
      [markup.goldmark.parser.attribute]
        block = true
{
   "markup": {
      "goldmark": {
         "parser": {
            "attribute": {
               "block": true
            }
         }
      }
   }
}
Ordinal

(int) The zero-based ordinal of the table on the page.

Page

(page) A reference to the current page.

PageInner

(page) A reference to a page nested via the RenderShortcodes method. See details.

Position

(string) The position of the table within the page content.

THead

(slice) A slice of table header rows, where each element is a slice of table cells.

TBody

(slice) A slice of table body rows, where each element is a slice of table cells.

Table cells

Each table cell within the slice of slices returned by the THead and TBody methods has the following fields:

Alignment

(string) The alignment of the text within the table cell, one of left, center, or right.

Text

(template.HTML) The text within the table cell.

Example

In its default configuration, Hugo renders Markdown tables according to the GitHub Flavored Markdown specification. To create a render hook that does the same thing:

layouts/_default/_markup/render-table.html
<table
  {{- range $k, $v := .Attributes }}
    {{- if $v }}
      {{- printf " %s=%q" $k $v | safeHTMLAttr }}
    {{- end }}
  {{- end }}>
  <thead>
    {{- range .THead }}
      <tr>
        {{- range . }}
          <th {{ printf "style=%q" (printf "text-align: %s" .Alignment) | safeHTMLAttr }}>
            {{- .Text -}}
          </th>
        {{- end }}
      </tr>
    {{- end }}
  </thead>
  <tbody>
    {{- range .TBody }}
      <tr>
        {{- range . }}
          <td {{ printf "style=%q" (printf "text-align: %s" .Alignment) | safeHTMLAttr }}>
            {{- .Text -}}
          </td>
        {{- end }}
      </tr>
    {{- end }}
  </tbody>
</table>

PageInner details

New in v0.125.0

The primary use case for PageInner is to resolve links and page resources relative to an included Page. For example, create an “include” shortcode to compose a page from multiple content files, while preserving a global context for footnotes and the table of contents:

layouts/shortcodes/include.html
{{ with site.GetPage (.Get 0) }}
  {{ .RenderShortcodes }}
{{ end }}

Then call the shortcode in your Markdown:

content/posts/p1.md
{{% include "/posts/p2" %}}

Any render hook triggered while rendering /posts/p2 will get:

  • /posts/p1 when calling Page
  • /posts/p2 when calling PageInner

PageInner falls back to the value of Page if not relevant, and always returns a value.

The PageInner method is only relevant for shortcodes that invoke the RenderShortcodes method, and you must call the shortcode using the {{%..%}} notation.

As a practical example, Hugo’s embedded link and image render hooks use the PageInner method to resolve markdown link and image destinations. See the source code for each:

  • Embedded link render hook
  • Embedded image render hook

On this page

  • Context
  • Table cells
  • Example
  • PageInner details
Last updated: August 31, 2024: Document change to data type returned by render hook Text methods (d32f7856)
By the Hugo Authors
Hugo Logo
  • File an Issue
  • Get Help
  • @GoHugoIO
  • @spf13
  • @bepsays
 

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

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

  • 新闻
  • 文档
  • 主题
  • 社区
  • GitHub
  • 关于 Hugo
  • 安装
  • 入门
  • Quick reference
  • 内容管理
  • 模板
  • 函数
  • 方法
  • Render hooks
  • Hugo Modules
  • Hugo Pipes
  • CLI
  • 故障排除
  • 开发工具
  • 托管 & 部署
  • 贡献
  • Maintenance