Merge commit '00c4484c7092181729f6f470805bc7d72e8ad17b'

This commit is contained in:
Bjørn Erik Pedersen
2022-11-17 16:16:19 +01:00
217 changed files with 2437 additions and 2821 deletions

View File

@@ -13,31 +13,31 @@ menu:
weight: 20
---
{{< new-in "0.62.0" >}} Note that this is only supported with the [Goldmark](/getting-started/configuration-markup#goldmark) renderer.
Note that this is only supported with the [Goldmark](/getting-started/configuration-markup#goldmark) renderer.
You can override certain parts of the default Markdown rendering to HTML by creating templates with base names `render-{kind}` in `layouts/_default/_markup`.
You can also create type/section specific hooks in `layouts/[type/section]/_markup`, e.g.: `layouts/blog/_markup`.{{< new-in "0.71.0" >}}
You can also create type/section specific hooks in `layouts/[type/section]/_markup`, e.g.: `layouts/blog/_markup`.
The hook kinds currently supported are:
* `image`
* `link`
* `heading` {{< new-in "0.71.0" >}}
* `heading`
* `codeblock`{{< new-in "0.93.0" >}}
You can define [Output-Format-](/templates/output-formats) and [language-](/content-management/multilingual/)specific templates if needed. Your `layouts` folder may look like this:
```goat { class="black f7" }
layouts
└── _default
└── _markup
```text
layouts/
└── _default/
└── _markup/
├── render-codeblock-bash.html
├── render-codeblock.html
├── render-heading.html
├── render-image.html
├── render-image.rss.xml
└── render-link.html
└── render-codeblock.html
└── render-codeblock-bash.html
```
Some use cases for the above:
@@ -83,10 +83,10 @@ Text
PlainText
: The plain variant of the above.
Attributes (map) {{< new-in "0.82.0" >}}
Attributes (map)
: A map of attributes (e.g. `id`, `class`)
### Link with title Markdown example:
### Link with title Markdown example
```md
[Text](https://www.gohugo.io "Title")
@@ -98,10 +98,10 @@ Here is a code example for how the render-link.html template could look:
<a href="{{ .Destination | safeURL }}"{{ with .Title}} title="{{ . }}"{{ end }}{{ if strings.HasPrefix .Destination "http" }} target="_blank" rel="noopener"{{ end }}>{{ .Text | safeHTML }}</a>
{{< /code >}}
### Image Markdown example:
### Image Markdown example
```md
![Text](https://d33wubrfki0l68.cloudfront.net/c38c7334cc3f23585738e40334284fddcaf03d5e/2e17c/images/hugo-logo-wide.svg "Title")
![Text](https://gohugo.io/images/hugo-logo-wide.svg "Title")
```
Here is a code example for how the render-image.html template could look:
@@ -146,7 +146,7 @@ layouts
└── render-codeblock-bash.html
```
The default behaviour for these code blocks is to do [Code Highlighting](/content-management/syntax-highlighting/#highlighting-in-code-fences), but since you can pass attributes to these code blocks, they can be used for almost anything. One example would be the built-in [GoAT Diagrams](/content-management/diagrams/#goat-diagrams-ascii) or this [Mermaid Diagram Code Block Hook](/content-management/diagrams/#mermaid-diagrams) example.
The default behavior for these code blocks is to do [Code Highlighting](/content-management/syntax-highlighting/#highlighting-in-code-fences), but since you can pass attributes to these code blocks, they can be used for almost anything. One example would be the built-in [GoAT Diagrams](/content-management/diagrams/#goat-diagrams-ascii) or this [Mermaid Diagram Code Block Hook](/content-management/diagrams/#mermaid-diagrams) example.
The context (the ".") you receive in a code block template contains: