Page With Notifications

This page shows how you can add Bulma notifications.

This is the message for the notification

Use the following code to include a simple notification.

{% include notification.html message="This is the message for the notification" %}

Overriding Defaults

The message is required but the status defaults to ‘is-warning’ and the icon defaults to ‘fas fa-exclamation-circle’, but can be overwritten by setting the values in the includes.

This is the message for the notification

{% include notification.html message="This is the message for the notification" 
status="is-danger" 
icon="fas fa-exclamation-triangle" %}

Markdown message

The notification message can also be written in markdown.

This message contains markdown and a link.

It also contains a second paragraph and a list.

List item
List item

{% include notification.html 
message="This **message** contains _markdown_ and a [link](https://www.csrhymes.com).

It also contains a second paragraph.

* List item
* List item
"  %}

Dismissible Notifications

To set a notification to be dismissible, set dismissible to ‘true’

This notification is dismissable

{% include notification.html
message="This notification is dismissable"
status="is-info"
dismissable="true" %}

Iconless Notifications

Omit the icon by setting icon to ‘false’

This notification does not have an icon.

{% include notification.html
message="This notification does not have an icon."
icon="false"
status="is-success" %}