Callout Component
A built-in component to show important information to the reader.
Note
GitHub-style alerts are supported since v0.9.0. It leverages Markdown syntax to render the callout which ensures better portability and readability of the content.
Examples
A callout is a short piece of text intended to attract attention.
A callout is a short piece of text intended to attract attention.
A callout is a short piece of text intended to attract attention.
A callout is a short piece of text intended to attract attention.
A callout is a short piece of text intended to attract attention.
Default
A callout is a short piece of text intended to attract attention.
{{< callout >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
Info
A callout is a short piece of text intended to attract attention.
{{< callout type="info" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
Warning
A callout is a short piece of text intended to attract attention.
{{< callout type="warning" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
Error
A callout is a short piece of text intended to attract attention.
{{< callout type="error" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
Important
A callout is a short piece of text intended to attract attention.
{{< callout type="important" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
Custom Icon
A callout is a short piece of text intended to attract attention.
{{< callout icon="sparkles" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
A callout is a short piece of text intended to attract attention.
{{< callout type="important" icon="sparkles" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
Emoji
🌐
A callout is a short piece of text intended to attract attention.
{{< callout emoji="🌐" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
ℹ️
A callout is a short piece of text intended to attract attention.
{{< callout type="info" emoji="ℹ️" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
Options
Parameter | Description |
---|---|
type | The type of callout. (default, info , warning , error , important ) |
emoji | The emoji to show before the callout. |
icon | The icon to show before the callout. (related to type or can be a custom icon). |
Last updated on