Huzzah! bramus_cssextras 0.5.0 has been released! No new features have been added, yet this version differs a lot from the previously released versions of bramus_cssextras: Under the hood bramus_cssextras has been totally rewritten to make it TinyMCE 3.0 compatible.
What is bramus_cssextras?
bramus_cssextras is a plugin for TinyMCE which enables the usage of CSS classes and CSS ids on any HTML element within TinyMCE. Together with an external CSS file, set via the TinyMCE content_css setting, bramus_cssextras bridges the (visual) gap between the content entered through TinyMCE and the actual output; as seen below.
Plain TinyMCE vs. TinyMCE with content_css vs. TinyMCE with content_css and bramus_cssextras
Where content_css only lets you view the CSS styles applied on elements, bramus_cssextras takes it to the next level by letting you set these CSS styles on any element, giving the user more power on the visual representation then ever before.
How does it work?
bramus_cssextras works really simple: Just hook it to TinyMCE, add the button references and you’re good to go. bramus_cssextras will do all the work for you, by scanning the defined content_css-file for possible classes/ids which can be set on elements. Then, when editing a piece of HTML through TinyMCE, bramus_cssextras will make your life easier by showing you which classes/ids can be set on the current element and will even let you set a specific class/id on that element.
Can I testdrive it?
Yes you can!
How much does it cost? / Where can I download it?
bramus_cssextras is free and released under a Creative Commons License. The latest version (0.5.0 the time of writing) can be downloaded from the project page.
I’m still using TinyMCE 2.x, is there a TinyMCE 2.x compatible version available?
bramus_cssextras 0.5.0 is TinyMCE 3.x only, older versions of bramus_cssextras are TinyMCE 2.x only. These older versions can also be downloaded from the project page (version 0.4.1 is suggested).
On a sidenote, I myself don’t suggest on using TinyMCE 3.0 as it still is in beta 😉
Hey, any chance you will fix the issues with the hanging drop down box?
This great plugin is pretty useless at the moment as all current browsers have this bug.
1. Select an image
2. select float left.
3. click somewhere
-> image floats left.
4.click image again
5. select float right
6. click somwheere
->image floats right
but combobox stays open.
no way to be closed.
this happens in all modern browsers. FF2-3.5 IE7,8. Chrome1-2
pleaaaase.!
Fix for the hanging dropdown box:
Just before the selectDropDown.renderMenu(); in _rebuildDropdown. add this code:
var dropdown = document.getElementById(‘menu_’ + ed.editorId + ‘_’ + selectDropDown.id + ‘_menu’);
if (dropdown !== null) {
dropdown.parentNode.removeChild(dropdown);
}
or if jquery is enabled:
$(‘#menu_’ + ed.editorId + ‘_’ + selectDropDown.id + ‘_menu’).remove();