Important changes to Tiny Cloud pricing > Find out more

Create custom notifications

Learn how to make custom dialogs with NotificationManager.

Contribute to this page

TinyMCE can display customized notifications.

Interactive example


The text property sets the text that is displayed at the center of the notification. This is the most important setting when opening a notification.{
  text: 'A test informational notification.'


The following notification types differ in color and purpose:

  • success
  • info
  • warning
  • error

Set the type property when opening the notification. The default style is used if this property is not set.{
  text: 'A test informational notification.',
  type: 'info'


The notification automatically closes after the value set in the timeout property elapses in milliseconds.{
  text: 'A test notification that will close automatically after 5 seconds.',
  timeout: 5000

Close Button

Disable the close button to the right of the notification by setting the closeButton property to false in conjunction with a timeout property that is not zero.{
  text: 'A test notification that will close automatically after 5 seconds and has the close button disabled.',
  timeout: 5000,
  closeButton: false


Set the icon property to display an icon to the left of the text.{
  text: 'A test notification that contains a bold icon.',
  icon: 'bold'

For a list of the icon identifiers, see: Available icons.

Progress Bar

Set the progressBar property type to True to display a progress bar to the left of the close button and to the right of the text.

var notification ={
  text: 'A test notification that contains a progress bar.',
  progressBar: true

Set the progressBar property between 0 and 100 to set the progress of the progress bar.


To close the last shown notification, call the following method:

// Close the last shown notification.

Can't find what you're looking for? Let us know.

Except as otherwise noted, the content of this page is licensed under the Creative Commons BY-NC-SA 3.0 License, and code samples are licensed under the Apache 2.0 License.