---
title: "Custom Notifications"
description: "Re-use existing notifications from your application. By enabling custom notifications you receive notification details and display a custom one instead."
url: https://docs.topol.io/email-editor/guide/custom-notifications.html
---

# Custom Notifications in Editor

**The editor shows its own notifications for saving, previewing, and errors.** Applications with their own toast component can take these over instead: turning the built-in alerts off routes every message to a callback, leaving the presentation to you.

## Disabling built-in alerts

Set the `disableAlerts` flag in your `TOPOL_OPTIONS` to stop the editor rendering its own notifications:

```ts
disableAlerts: true,
```

Every message the editor would have shown then goes to the `onAlert` callback.

## Using the onAlert callback

The `onAlert` callback receives each notification in place of the built-in toast:

```ts
callbacks: {
  onAlert: (notification) => {
    // Use your custom UI here
    // Example: showToast(notification.title, notification.text)
  }
}
```

> **WARNING**
>
> The two paths are mutually exclusive. **`onAlert` fires only while `disableAlerts` is `true`**, and with alerts enabled the editor renders its own toast and the callback is never called. There is no configuration where both happen.

The `notification` object includes:

-   `text`: The message. Required.

-   `type`: `"info"`, `"success"`, or `"error"`. Required.

-   `title`: An optional short heading for the alert.

-   `persistent`: Whether the notification stays until dismissed.


## Triggering a custom notification

The `TopolPlugin.createNotification()` method displays a notification from your application:

```ts
TopolPlugin.createNotification({
  title: "Title of the notification",
  text: "Important message you want to display",
  type: "info", // info | error | success
  persistent: true | false, // set to true if you don't want the notification to auto-dismiss
});
```

Notifications dismiss themselves after three seconds unless `persistent` is `true`.

> **INFO**
>
> `createNotification()` always renders the editor's built-in notification, **even when `disableAlerts` is `true`**, and such calls do not reach `onAlert`. An application that owns its notification UI should use its own toast component directly rather than this method.