1. Home
  2. Docs
  3. Bootstrap Visuals for Confluence
  4. User Guide
  5. Toast

Toast

Example

Description

The “Toast” message is a small popup window for alert like messages. It was introduced in Bootstrap 5. You have several options to configure where it appears, for how long it appears and what color style it should have.

Adding the Macro

Edit your page.

Select “+” => Other macros

Type in “Bootstrap” in the Search box

Select the “Bootstrap 5 Toast” macro

Macro Options

Style

Select one of the Bootstrap styles. Leave empty for default.

Icon Style

A rounded square icon is in the top left of the header. Select one of the Bootstrap color styles for it here.

Title

Enter the title of the Toast here.

Show Timestamp

Select this option if you want to show a timestamp at the right side of the header. The timestamp shows when the toast message was loaded.

Position

Here you can select, where on the page the toast shall pop up. You can select between:

  • Top left
  • Top center
  • Top right
  • Middle left
  • Middle center
  • Middle right
  • Bottom left
  • Bottom center
  • Bottom right

Auto Close

If you want the toast to automatically close, enter the amount of milliseconds here after which that shall happen. Enter 0 for no auto close. You can always close the toast by clicking the close button (x) in the upper right corner.

 

Was this article helpful to you? Yes No

Leave a Reply

Your email address will not be published.