All to need is edit function in plugin (plugins/textcolor/plugin.js
). Then result will be:
function onPanelClick(e) {
var buttonCtrl = this.parent(), value;
if ((value = e.target.getAttribute('data-mce-color'))) {
buttonCtrl.hidePanel();
buttonCtrl.color(value););
if (value == 'transparent') {
tinyMCE.execCommand("RemoveFormat");
} else {
editor.execCommand(buttonCtrl.settings.selectcmd, false, value);
}
}
}
After that, edit tinymce.js
is required too. All to need is editor removeformat
, for example:
removeformat: [
{selector: 'span', styles: ['background-color'], remove: 'empty', split: true, expand: false, deep: true}
]
(FOR OTHER USERS) to add new color to panel, insert this code in function renderColorPicker()
, recommended before loop:
function renderColorPicker() {
...
html += '<tr>';
html += (
'<td colspan="' + cols + '">' +
'<div id="' + ctrl._id + '-00" class="color-box"' +
' data-mce-color="transparent"' +
' role="option"' +
' tabIndex="-1"' +
' style="background-color: transparent"' +
' title="Default color">' +
'<span>Default color</span></div>' +
'</td>'
);
html += '</tr>';
for (y = 0; y < rows; y++){
...