Dialogs in normal flow and inside an example modal

dialogsFade is still supported across the classic dialog modules. For editors inside a modal, dialogsInBody remains the safer configuration because the dialog markup is attached to the page body.

Inline editor with faded dialogs

Use the link, image, or video buttons to see the fade effect.

Open the link dialog here and notice the dialog fade transition.

Editor inside a modal

This modal initializes Summernote with dialogsInBody: true.

Example configuration - Dialogs

summernote.create('#dialogs-fade-editor', {
  height: 240,
  dialogsFade: true,
  toolbar: [
    ['insert', ['link', 'picture', 'video']],
    ['view', ['codeview']],
  ],
});

summernote.create('#modal-editor', {
  height: 240,
  dialogsInBody: true,
  dialogsFade: true,
  toolbar: [
    ['insert', ['link', 'picture', 'video']],
    ['view', ['codeview']],
  ],
});