Change font family, size, and size unit

fontName, fontSize, and fontSizeUnit are still exposed as editor commands. The buttons below always target the same phrase so the resulting inline styles are easy to compare.

These buttons style this selected phrase and preserve the resulting inline style.

HTML output

Ready.

Example configuration - Font Family and Size

summernote.create('#font-family-size-editor', {
  height: 240,
  fontSizeUnits: ['px', 'pt'],
});

summernote.invoke('#font-family-size-editor', 'fontName', 'Courier New');
summernote.invoke('#font-family-size-editor', 'fontSize', 20);
summernote.invoke('#font-family-size-editor', 'fontSizeUnit', 'pt');