Configure buttons acting weird

In Redactor 3.0.1 there is something odd going on with the ability to customize the buttons in Redactor. For example font size gets inserted between the bold and italics buttons. If you try to add all the buttons available, they don’t all show up either.

As an example, with this configuration:
format, inlinestyle, alignment, fontsize, divider, bold, italic, underline, divider, table, link, image, file, divider, ol, ul, indent, outdent, divider, redo, undo, divider, properties, specialchars, html

You get this layout:

Bold is in the wrong group away from italics and underline while properties and specialchars doesn’t show up at all. Anyone else seeing this kind of weirdness?

There are some restrictions in how buttons are added to the toolbar. Those are largely caused by hardcoded positions in some official plugins built by Imperavi.

All of these exceptions are listed here:

https://docs.modmore.com/en/Redactor/v3.x/Features/Toolbar.html#page_Redactor+Plugins

Luckily most of these limitations are resolved in v3.1 thanks to an update of redactor.js and several plugins, as well as some improvements to how we turn your configuration into the configuration passed into redactor.js. That update makes the positioning much more flexible and work reliably.

The properties not showing up is a separate bug, which has also been fixed in v3.1.

V3.1 is almost ready for release, I’d estimate that to become available anywhere between this friday and two weeks tops.

1 Like

Thanks. Hopefully v3.1 will fix most of those bugs then.

One question. In the documentation it says plugins like alignment and fontsize are added to the end of the toolbar. However, in my example above it seems like they are getting inserted (along with their divider) between the bold and italics buttons. What’s up with that?

Good question. I suspect the bug in the properties plugin that has been fixed causes it to render like that.

Here’s what your configuration format, inlinestyle, alignment, fontsize, divider, bold, italic, underline, divider, table, link, image, file, divider, ol, ul, indent, outdent, divider, redo, undo, divider, properties, specialchars, html looks like in 3.1:

Looks like it’s correct up until file, divider, ol where the divider is misplaced by one, and also the one that should be before the redo. html is also in the wrong position. Will have a play with your config before the 3.1 release to see if I can also fix those cases.

1 Like