Notifications

Display a toast notification triggered by a button click or automatically on page load. It is shown in the block inserter as Canvas Notification and registered as canvas-core/notification.

Select the block on a page and its own settings open in the sidebar, in the panels below:

Settings

Each setting is named exactly as the block editor names it, followed by what it does and what it starts as. Where a setting carries a Shown when line, it stays hidden until that condition is met, which is the usual reason a setting looks missing from the sidebar:

Content

• Notification MessageDefaultEmpty

  What the message says. Emphasis, a link and an icon before the copy are all kept, and an icon in front is the usual treatment.

Settings

• ModeDefaultTrigger (button/link that shows a toast)

  A Toast renders the notification panel itself, in place, hidden until a trigger targets it.

  ChoicesTrigger (button/link that shows a toast)Toast (a standalone toast a trigger opens)

• TypeDefaultPrimary

  What the message is telling a visitor, which sets its colour: a confirmation, a warning, a failure or a plain note.

  ChoicesPrimarySuccessWarningError / DangerInfoDarkShown when Mode is "Trigger (button/link that shows a toast)"

• PositionDefaultTop Right

  Where on the screen the message appears once it is shown.

  ChoicesTop LeftTop CenterTop RightMiddle LeftMiddle CenterMiddle RightBottom LeftBottom CenterBottom RightShown when Mode is "Trigger (button/link that shows a toast)"

• Auto HideDefaultOn

  Dismisses the message on its own after the delay below. Turn it off for something a visitor must read and close.

• Auto Hide Timeout (ms)Default5000

  How long the message stays on screen before it dismisses itself, in milliseconds.

  Shown when Auto Hide is on

• Show Close ButtonDefaultOn

  Adds a dismiss control so a visitor can put the message away themselves.

  Shown when Mode is "Trigger (button/link that shows a toast)"

• TriggerDefaultClick

  What brings the message up: a visitor pressing the control, or the page opening.

  ChoicesClickAuto (on page load)Shown when Mode is "Trigger (button/link that shows a toast)"

• Existing Toast SelectorDefaultEmpty

  Open a toast that is already on the page instead of building one. Leave empty to build the toast from the message above.

  Shown when Mode is "Trigger (button/link that shows a toast)"

• Trigger ElementDefaultButton

  Whether the control is drawn as a button or as a text link.

  ChoicesButtonLinkShown when Mode is "Trigger (button/link that shows a toast)"

• Trigger TextDefaultShow Notification

  Wording on that control.

  Shown when Mode is "Trigger (button/link that shows a toast)"

• Trigger ClassesDefaultEmpty

  Replaces the default "btn btn-{type}" class list on the trigger.

  Shown when Mode is "Trigger (button/link that shows a toast)"

• Toast TitleDefaultEmpty

  Heading along the top of the message, above the copy.

  Shown when Mode is "Toast (a standalone toast a trigger opens)"

• Toast MetaDefaultEmpty

  Small note beside that heading, usually how long ago the message arrived.

  Shown when Mode is "Toast (a standalone toast a trigger opens)"

• Dock to Viewport CornerDefaultOn

  Wrap the toast in a fixed-position container so it floats over the page.

  Shown when Mode is "Toast (a standalone toast a trigger opens)"

• Dock ClassesDefaultposition-fixed bottom-0 end-0 p-3 text-start

  Classes on the floating container, which decide which corner of the screen the message sits in and how far it stands off the edges.

  Shown when Mode is "Toast (a standalone toast a trigger opens)"

Related

Every Canvas block also carries the Animation, Scroll Effects and Advanced panels, which are described in Controls every Canvas block has.

Other blocks in Canvas: Alerts, Buttons, Code Highlight, Counters, Dividers, Dropcaps.