Ultimate Toast

Brandarrow's official documentation for Ultimate Toast – Bubble.io Plugin.

---

Vitals

Description

The Ultimate Toast & Notifications plugin offers a powerful and customizable solution for displaying modern toast notifications and alert messages in Bubble.io applications. Ideal for SaaS platforms, dashboards, eCommerce, and mobile-first apps, this plugin enables rich user experience (UX) interactions without complex coding. It supports fully customizable, responsive toasts with headings, icons, buttons, and event triggers.

Price

Free

Installation

Ultimate Toast & Notifications Plugin for BubbleBubble

Add the plugin to your Bubble app via the official plugin marketplace.

Demo & Editor

Demo Editor

---

Instructions

1

Triggering Toasts via Workflow

Use the Trigger Toast action in a Bubble workflow to display a notification:

• Action: Trigger Toast → [Toast Element]

2

Customizable Properties

Toast Message: The main body text of the notification.

Heading: An optional title displayed beside the icon.

Icon: Specify an icon using Iconify format (e.g., fluent:fluent-24-filled).

Colors & Styles: Customize text color, background color, font size, font family, and border radius.

Primary & Secondary Buttons:

• Enable one or both buttons.

• Set custom text, styles, and hover effects.

• Assign workflows to button clicks.

3

Positioning Toasts

Set the toast_position field to control toast placement:

• top-left

• top-center

• top-right

• bottom-left

• bottom-center

• bottom-right

• center

4

Toast Duration & Behavior

Toast Duration: Set toast_duration (in milliseconds) to control how long the toast remains visible.

Event Triggers: Capture interactions via:

• Toast Clicked

• Primary Button Clicked

• Secondary Button Clicked

5

Advanced Configuration

Adjust gaps between inner elements for precise layout control.

Enable fade-out animations for smooth transitions.

Use published internal states to track interactions or trigger additional workflows.

That's it you are ready to use the plugin

Components

Element

• Ultimate Toast: The primary element for displaying notifications.

• Ultimate Toast Inline

Action

• Toast A Ultimate Toast

• End a loader Toast A Ultimate Toast

• Inline Toast A Ultimate Toast

Events

• Ultimate Toast Clicked

• Ultimate Toast Primary Button Clicked

• Ultimate Toast Secondary Button Clicked

• Ultimate Toast Inline Primary

• Ultimate Toast Inline Secondary

• Ultimate Toast Inline Toast

Data calls

None

---

Common Issues & Troubleshooting

Issue	Cause	Solution
Toast Not Appearing	Element hidden or incorrect ID	Verify the Toast element is on the page and not hidden (e.g., check visibility settings). Ensure the Element ID matches the ID specified in the workflow.
Icons Not Loading	Incorrect icon format or typos	Confirm the icon name follows Iconify format (e.g., fluent:fluent-24-filled). Check for typos in the icon category or name.
Events Not Firing	Missing workflows or disabled buttons	Ensure workflows are set up for Toast Clicked, Primary Button Clicked, or Secondary Button Clicked. Verify that buttons are enabled in the Toast element properties.
Multiple Toasts Overlapping	Simultaneous toast triggers or long duration	Add slight delays (e.g., 500 ms) between toast triggers to prevent overlap. Adjust toast_duration to control visibility timing.
Mobile Display Issues	Non-responsive settings or cramped layout	Test the toast’s responsive settings to ensure proper rendering on smaller screens. Adjust font sizes or gaps if content appears cramped.
Workflow Errors	Incorrect conditional logic or reusable element conflicts	Check that conditional logic or custom states triggering the toast are correctly configured. Ensure the Toast element is compatible with reusable elements by using a unique Element ID.

---

Version	Status	Date	Changes
v1.0.0	Shipped	10/22/24	Initial release
v1.0.1	Shipped	12/25/24	Added responsive mode and loader toast
v1.0.2	Shipped	1/17/25	Allowed toast content to be optional
v1.0.3	Shipped	5/5/25	Added box-shadow because someone complained in the reviews...
v1.0.4	Shipped	7/13/25	Bug patch, buttons were not working
v1.0.5	Shipped	7/18/25	Inline toast fixed and working
v1.0.6	Shipped	7/18/25	Bug fixes for inline toast: position, animation, content line spacing

---

Need Help?

Help & Support

---