[raw]

Heads up! This is an alert that needs your attention, but it’s not a huge priority just yet.
Toggle
Well done! You successfully read this alert message.
Toggle
Holy guacamole! Best check yo self, you’re not looking too good.
Toggle
Oh snap! Change this and that and try again.
Toggle

[spacer height=”23px”]
[divider]
[spacer height=”24px”]
[/raw]
[raw]

Get The Code

[spacer height=”4px”]

[codebox line_numbers=”true” remove_breaks=”true” lang=”html”]
[alert type="info" show_close="true"]…[/alert]
[alert type="success" show_close="true"]…[/alert]
[alert type="warning" show_close="true"]…[/alert]
[alert type="error" show_close="true"]…[/alert]
[/codebox]

[spacer height=”23px”]
[divider]

[spacer height=”24px”]
[/raw]

[raw]

Customization Options

[list]
[list_item]type – the kind of alert it is (info, success, warning or error)[/list_item]
[list_item]show_close – whether to show the close button ‘x’ on the right[/list_item]
[list_item]color – the background color of the alert (you can choose any color you like)[/list_item]
[/list]
[/raw]

Print Friendly