Bramus CSS add-on for TinyMCE 4

CSS plugin for TinyMCE
bramus-cssextras screenshot
bramus-cssextras screenshotebramus-cssextras screenshot

It 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.

Where content_css only lets you view the CSS styles applied on elements (and supports the setting of classes only on elements), bramus_cssextras takes it to the next level by letting you set these CSS styles, based on CSS Class Selectors and CSS ID Selectors, on any element, giving the user more power on the visual representation then ever before (imagine one being able to choose 20 different classes or a handful of ids to apply on p elements with the ease of a click).

Get more info on Bramus CSS home page: https://www.bram.us/

TinyMCE 4 logoTinyMCE 4 compatible
or

Bramus CSS add-on installation

  1. Download plugin from developer website
  2. Copy bramus-cssextras directory to tinymce/plugins/.
  3. Edit TinyMCE config and add bramus-cssextras to plugins key
  4. Enjoy!

Refer to TinyMCE add-ons installation manual for more details