HUGO
Menu
GitHub 87548 stars Mastodon

transform.Highlight

Renders code with a syntax highlighter.

Syntax

transform.Highlight CODE LANG [OPTIONS]

Returns

template.HTML

Alias

highlight

The highlight function uses the Chroma syntax highlighter, supporting over 200 languages with more than 40 highlighting styles.

Arguments

The transform.Highlight shortcode takes three arguments.

CODE
(string) The code to highlight.
LANG
(string) The language of the code to highlight. Choose from one of the supported languages. This value is case-insensitive.
OPTIONS
(map or string) A map or comma-separated key-value pairs wrapped in quotation marks. Set default values for each option in your site configuration. The key names are case-insensitive.

Examples

{{ $input := `fmt.Println("Hello World!")` }}
{{ transform.Highlight $input "go" }}

{{ $input := `console.log('Hello World!');` }}
{{ $lang := "js" }}
{{ transform.Highlight $input $lang "lineNos=table, style=api" }}

{{ $input := `echo "Hello World!"` }}
{{ $lang := "bash" }}
{{ $opts := dict "lineNos" "table" "style" "dracula" }}
{{ transform.Highlight $input $lang $opts }}

Options

anchorLineNos
(bool) 是否将每个行号渲染为 HTML 锚元素,将周围 span 元素的 id 属性设置为行号。如果 lineNosfalse,则此选项无关。默认为 false
codeFences
(bool) 是否高亮代码围栏。默认为 true
guessSyntax
(bool) 如果 LANG 参数为空或设置为没有相应 词法分析器 的语言,是否自动检测语言。如果无法自动检测语言,则回退到纯文本词法分析器。默认为 false

Chroma 语法高亮器包含约 250 种语言的词法分析器,但其中只有 5 种实现了自动语言检测。

hl_Lines
(string) 要在高亮代码中强调的行的空格分隔列表。要强调第 2、3、4 和 7 行,将此值设置为 2-4 7。此选项独立于 lineNoStart 选项。
hl_inline
(bool) 是否在没有包装容器的情况下渲染高亮代码。默认为 false
lineAnchors
(string) 在将行号渲染为 HTML 锚元素时,将此值前置到周围 span 元素的 id 属性。当页面包含两个或更多代码块时,这提供了唯一的 id 属性。如果 lineNosanchorLineNosfalse,则此选项无关。
lineNoStart
(int) 在第一行显示的数字。如果 lineNosfalse,则此选项无关。默认为 1
lineNos
(any) 控制行号显示。默认为 false
  • true:启用行号,由 lineNumbersInTable 控制。
  • false:禁用行号。
  • inline:启用内联行号(将 lineNumbersInTable 设置为 false)。
  • table:启用基于表格的行号(将 lineNumbersInTable 设置为 true)。
lineNumbersInTable
(bool) 是否在 HTML 表格中渲染高亮代码,包含两个单元格。左表格单元格包含行号,右表格单元格包含代码。如果 lineNosfalse,则此选项无关。默认为 true
noClasses
(bool) 是否使用内联 CSS 样式而不是外部 CSS 文件。默认为 true。要使用外部 CSS 文件,将此值设置为 false 并从命令行生成 CSS 文件:
hugo gen chromastyles --style=monokai > syntax.css
style
(string) 应用于高亮代码的 CSS 样式。区分大小写。默认为 monokai。请参阅 语法高亮样式
tabWidth
(int) 用此数量的空格替换高亮代码中的每个制表符。如果 noClassesfalse,则此选项无关。默认为 4
wrapperClass
New in v0.140.2
(string) 用于高亮代码最外层元素的类。默认为 highlight

Last updated: January 1, 0001
Improve this page