Alert
<time datetime="2023-06-30 00:00:00 +0000 UTC">June 30 2023</time><span class="px-2 text-primary-500">·</span><time datetime="2024-02-28 22:28:09 -0600 CST">Updated: February 28 2024</time><span class="px-2 text-primary-500">·</span><span>227 words</span><span class="px-2 text-primary-500">·</span><span title="Reading time">2 mins</span>
Blowfish
Shortcodes
Alert
blowfish shortcodes - This article is part of a series.
- 🐡 Shortcodes
alert- Create a styled, attention-catching message box within your article.
It’s useful for drawing attention to important information that you don’t want the reader to miss.
| Parameter | Description |
|---|---|
icon |
Optional. the icon to display on the left side. Default: exclaimation triangle icon (Check out the
icon shortcode for more details on using icons.) |
iconColor |
Optional. the color for the icon in basic CSS style. Can be either hex values ( #FFFFFF) or color names (white)By default chosen based on the current color theme. |
cardColor |
Optional. the color for the card background in basic CSS style. Can be either hex values ( #FFFFFF) or color names (white)By default chosen based on the current color theme. |
textColor |
Optional. the color for the text in basic CSS style. Can be either hex values ( #FFFFFF) or color names (white)By default chosen based on the current color theme. |
The input is written in Markdown so you can format it however you please.
Example 1: No params
{{< alert >}}
**Warning!** This action is destructive!
{{< /alert >}}
Warning! This action is destructive!
Example 2: Unnamed param
{{< alert "twitter" >}}
Don't forget to [follow me](https://twitter.com/nunocoracao) on Twitter.
{{< /alert >}}
Don’t forget to
follow me on Twitter.
Example 3: Named params
{{< alert icon="fire" cardColor="#e63946" iconColor="#1d3557" textColor="#f1faee" >}}
This is an error!
{{< /alert >}}
This is an error!