diff options
Diffstat (limited to 'docs/content/en/getting-started/configuration-markup.md')
| -rw-r--r-- | docs/content/en/getting-started/configuration-markup.md | 116 |
1 files changed, 1 insertions, 115 deletions
diff --git a/docs/content/en/getting-started/configuration-markup.md b/docs/content/en/getting-started/configuration-markup.md index e19bbe47f..b323ba464 100644 --- a/docs/content/en/getting-started/configuration-markup.md +++ b/docs/content/en/getting-started/configuration-markup.md @@ -119,119 +119,5 @@ ordered ## Markdown Render Hooks -{{< new-in "0.62.0" >}} +See [Markdown Render Hooks](/templates/render-hooks/). -Note that this is only supported with the [Goldmark](#goldmark) renderer. - -Render Hooks allow custom templates to override markdown rendering functionality. You can do this by creating templates with base names `render-{feature}` 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" >}} - -The features currently supported are: - -* `image` -* `link` -* `heading` {{< new-in "0.71.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: - -```bash -layouts -└── _default - └── _markup - ├── render-image.html - ├── render-image.rss.xml - └── render-link.html -``` - -Some use cases for the above: - -* Resolve link references using `.GetPage`. This would make links portable as you could translate `./my-post.md` (and similar constructs that would work on GitHub) into `/blog/2019/01/01/my-post/` etc. -* Add `target=_blank` to external links. -* Resolve and [process](/content-management/image-processing/) images. -* Add [header links](https://remysharp.com/2014/08/08/automatic-permalinks-for-blog-posts). - -### Render Hook Templates - -The `render-link` and `render-image` templates will receive this context: - -Page -: The [Page](/variables/page/) being rendered. - -Destination -: The URL. - -Title -: The title attribute. - -Text -: The rendered (HTML) link text. - -PlainText -: The plain variant of the above. - -The `render-heading` template will receive this context: - -Page -: The [Page](/variables/page/) being rendered. - -Level -: The header level (1--6) - -Anchor -: An auto-generated html id unique to the header within the page - -Text -: The rendered (HTML) text. - -PlainText -: The plain variant of the above. - -Attributes (map) {{< new-in "0.82.0" >}} -: A map of attributes (e.g. `id`, `class`) - -#### Link with title Markdown example: - -```md -[Text](https://www.gohugo.io "Title") -``` - -Here is a code example for how the render-link.html template could look: - -{{< code file="layouts/_default/_markup/render-link.html" >}} -<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: - -```md - -``` - -Here is a code example for how the render-image.html template could look: - -{{< code file="layouts/_default/_markup/render-image.html" >}} -<p class="md__image"> - <img src="{{ .Destination | safeURL }}" alt="{{ .Text }}" {{ with .Title}} title="{{ . }}"{{ end }} /> -</p> -{{< /code >}} - -#### Heading link example - -Given this template file - -{{< code file="layouts/_default/_markup/render-heading.html" >}} -<h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }} <a href="#{{ .Anchor | safeURL }}">¶</a></h{{ .Level }}> -{{< /code >}} - -And this markdown - -```md -### Section A -``` - -The rendered html will be - -```html -<h3 id="section-a">Section A <a href="#section-a">¶</a></h3> -``` |