You may freely arrange the buttons to be displayed on the balloon popup.
Use 'editor.balloon' to configure the buttons required to edit texts, images, videos, layers, hyperlinks and tables.
{
'editor.balloon': {
'Name of balloon popup1': ['button1', 'button2', '-', 'button3', 'button4'],
'Name of balloon popup2': ['button5', 'button6', '-', 'button7', 'button8']
}
} |
Available Balloon Popup Names
| Name | text | image | video | div | hyperlink | tableCell |
|---|---|---|---|---|---|---|
| Description | text | image | video | layer | hyperlink | table |
Please refer to Toolbar Configuration for more available balloon popup names.
{
'editor.balloon': {
'text': ['fontFamilyWithText', 'fontSizeWithText', '-', 'bold', 'italic', 'underline', 'strike', 'fontColor', 'fontBackgroundColor'],
'image': ['objVertAlignBottom', 'link', 'unlink', 'openLink', 'alt', 'caption', '-', 'imageProperties', 'rotateDrawingObjectLeft', 'rotateDrawingObjectRight', 'imageOriginSize', 'tuiImageEditor', 'deleteImage'],
'video': ['objVertAlignBottom', 'videoProperties', 'deleteVideo'],
'div': ['drawingObjectBorderColor', 'drawingObjectLineThickness', 'drawingObjectLineStyle', '-', 'drawingObjectFill', 'divProperties', 'deleteDiv'],
'hyperlink': ['link', 'unlink', 'openLink'],
'tableCell': ['formulaInput', '-', 'fill', 'selectBorder', 'borderColor', 'lineThickness', 'lineStyle', 'cellSize', 'mergeCell', 'splitCell', 'fitTableWidth', '-', 'contentsAlign', 'verticalAlign', 'deleteRow', 'deleteCol', 'cellProperties', 'tableProperties', 'deleteTable']
}
} |
{
'editor.balloon': {
'tableCell': ['formulaInput', '-', 'fill', 'selectBorder', 'borderColor', 'lineThickness', 'lineStyle', 'fitTableWidth', '-', 'insertRowBefore', 'insertRowAfter', 'insertColBefore', 'insertColAfter', 'deleteRow', 'deleteCol', 'deleteTable', '-', 'contentsAlign', 'verticalAlign', 'cellSize', 'mergeCell', 'splitCell', 'cellProperties', 'tableProperties']
}
} |
| Result of Applying Table Editing Balloon Popup Configuration |
|---|