Izi Message - Toast notifications

Izi Message shows Drupal status messages (status, warning and error) as modern toast notifications. It uses the iziToast JavaScript library. All messages from Drupal core and contrib modules become popup toasts. You do not need to change your theme or write custom code.

Use this module if you want nice, responsive and lightweight notifications on Drupal 9, 10 or 11.

• Features
• Requirements
• Installation
• Configuration
• Similar modules

Features

• Replaces default Drupal messages from \Drupal::messenger() with toast notifications.
• Works on the frontend and admin themes.
• Position on the screen: top right, bottom center and others.
• Light or dark theme, max width, title and message size.
• Timeout, progress bar, pause or reset timer on hover.
• Close button, close on click, close on Escape, drag to close.
• Open and close animations, with separate options for mobile devices.
• Overlay mode and RTL (right-to-left) support.
• All options are on one settings page. No code needed.

Requirements

• Drupal 9.3, 10 or 11.
• iziToast JavaScript library, version 1.4.0.

Important: install the library before you enable the module. If the library is missing, Drupal will not let you enable the module and the Status report page will show an error.

Installation

1. Install the iziToast library

The library file must be in this place:

/libraries/iziToast/dist/js/iziToast.min.js

The folder name is iziToast. It is case-sensitive.

Option A — manual download. Download iziToast v1.4.0 and extract it to the /libraries/iziToast folder in your Drupal web root.

Option B — Composer. Add this repository to the composer.json file of your project:

"repositories": [
  {
    "type": "package",
    "package": {
      "name": "marcelodolza/izitoast",
      "version": "1.4.0",
      "type": "drupal-library",
      "extra": {
        "installer-name": "iziToast"
      },
      "dist": {
        "url": "https://github.com/marcelodolza/iziToast/archive/refs/tags/v1.4.0.zip",
        "type": "zip"
      }
    }
  }
]

Then run:

composer require marcelodolza/izitoast drupal/izi_message

2. Enable the module

drush en izi_message

Or enable it on the Extend page. See Installing modules for more information.

Configuration

1. Go to Administration > Configuration > Development > Izi message settings (/admin/config/development/izi_message/settings).
2. Change the options you need and click Save configuration.

You need the Administer site configuration permission to open this page.

Similar modules

• Better Messages
• Status Messages

Izi Message is a good choice if you want ready-made toast notifications with many settings and no custom JavaScript.