如何在tinyMCE中更改工具栏和按钮大小

Question

我已经创建了一个编辑器页面，我正在尝试增加工具栏和按钮的大小，这就是我尝试过的

我想要的是下面给出的

有没有办法在tinyMCE中做到这一点，任何帮助感激不尽！

Answer 1

默认情况下，TinyMCE仅接受工具栏中20px × 20px的图标。 如果要创建宽度超过20像素的自定义工具栏图标，则需要在TinyMCE中编辑ui.css。 编辑ui.css（ tiny_mce / themes / advanced / skins / default / ui.css ）并更改以下值：

.defaultSkin span.mceIcon, .defaultSkin img.mceIcon {display:block; width:20px; height:20px}
.defaultSkin .mceButton {display:block; border:1px solid #F0F0EE; width: 20px; height:20px; margin-right:1px}

根据需要更改宽度和高度值。

Answer 2

JQuery方法：在控制台浏览器上执行以下指令时

$('a[role=button]') 

您将拥有20px所以，您可以执行以下指示：

$('a[role=button],img.mceIcon,span.mceIcon').css({'width':'30px','height':'30px'})
$('img.mceIcon,span.mceIcon').css('margin','2px')