Skip to content

Commit

Permalink
Clarify blockquote render hook Markdown syntax
Browse files Browse the repository at this point in the history
  • Loading branch information
jmooring authored Sep 3, 2024
1 parent d32f785 commit de3c756
Showing 1 changed file with 32 additions and 11 deletions.
43 changes: 32 additions & 11 deletions content/en/render-hooks/blockquotes.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,15 +28,13 @@ Blockquote render hook templates receive the following [context]:

{{< new-in 0.134.0 >}}

(`hstring.HTML`) Applicable when [`Type`](#type) is `alert` when using [Obsidian callouts] syntax, this is the alert title converted to HTML.
(`template.HTML`) Applicable when [`Type`](#type) is `alert`, this is the alert title. See the [alerts](#alerts) section below.

###### AlertSign

{{< new-in 0.134.0 >}}

(`string`) Applicable when [`Type`](#type) is `alert` when using [Obsidian callouts] syntax, this is one of "+", "-" or "" (empty string) to indicate the presence of a foldable sign.

[Obsidian callouts]: https://help.obsidian.md/Editing+and+formatting/Callouts
(`string`) Applicable when [`Type`](#type) is `alert`, this is the alert sign. Typically used to indicate whether an alert is graphically foldable, this is one of&nbsp;`+`,&nbsp;`-`,&nbsp;or an empty string. See the [alerts](#alerts) section below.

###### Attributes

Expand Down Expand Up @@ -110,7 +108,11 @@ Then in your markdown:

## Alerts

Also known as _callouts_ or _admonitions_, alerts are blockquotes used to emphasize critical information. For example:
Also known as _callouts_ or _admonitions_, alerts are blockquotes used to emphasize critical information.

### Basic syntax

With the basic Markdown syntax, the first line of each alert is an alert designator consisting of an exclamation point followed by the alert type, wrapped within brackets. For example:

{{< code file=content/example.md lang=text >}}
> [!NOTE]
Expand All @@ -129,14 +131,30 @@ Also known as _callouts_ or _admonitions_, alerts are blockquotes used to emphas
> Advises about risks or negative outcomes of certain actions.
{{< /code >}}
The basic syntax is compatible with [GitHub], [Obsidian], and [Typora].

[GitHub]: https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#alerts
[Obsidian]: https://help.obsidian.md/Editing+and+formatting/Callouts
[Typora]: https://support.typora.io/Markdown-Reference/#callouts--github-style-alerts

### Extended syntax

With the extended Markdown syntax, you may optionally include an alert sign and/or an alert title. The alert sign is one of&nbsp;`+`&nbsp;or&nbsp;`-`, typically used to indicate whether an alert is graphically foldable. For example:

{{< code file=content/example.md lang=text >}}
> [!WARNING]+ Radiation hazard
> Do not approach or handle without protective gear.
{{< /code >}}
The extended syntax is compatible with [Obsidian].

{{% note %}}
This syntax is compatible with both the GitHub Alert Markdown extension and Obsidian's callout syntax.
But note that GitHub will not recognize callouts with one of Obsidian's extensions (e.g. callout title or the foldable sign).
The extended syntax is not compatible with GitHub or Typora. If you include an alert sign or an alert title, these applications render the Markdown as a blockquote.
{{% /note %}}

The first line of each alert is an alert designator consisting of an exclamation point followed by the alert type, wrapped within brackets.
### Example

The blockquote render hook below renders a multilingual alert if an alert designator is present, otherwise it renders a blockquote according to the CommonMark specification.
This blockquote render hook renders a multilingual alert if an alert designator is present, otherwise it renders a blockquote according to the CommonMark specification.

{{< code file=layouts/_default/_markup/render-blockquote.html copy=true >}}
{{ $emojis := dict
Expand All @@ -151,7 +169,11 @@ The blockquote render hook below renders a multilingual alert if an alert design
<blockquote class="alert alert-{{ .AlertType }}">
<p class="alert-heading">
{{ transform.Emojify (index $emojis .AlertType) }}
{{ or (i18n .AlertType) (title .AlertType) }}
{{ with .AlertTitle }}
{{ . }}
{{ else }}
{{ or (i18n .AlertType) (title .AlertType) }}
{{ end }}
</p>
{{ .Text }}
</blockquote>
Expand All @@ -172,7 +194,6 @@ tip = 'Tip'
warning = 'Warning'
{{< /code-toggle >}}


Although you can use one template with conditional logic as shown above, you can also create separate templates for each [`Type`](#type) of blockquote:

```text
Expand Down

0 comments on commit de3c756

Please sign in to comment.