CKEditor extraAllowedContent with a Twist

  • mike_endale

    Mike Endale

Ever wanted to have fun with CKEditor? Well, let's see.

We wanted to allow CKEditor to have an in-line stylesheet for a specific class while enabling the Advanced Content Filter. This turns out pretty tricky because of the spotty CKEditor documentation and we thought we'd share. Here is a simple one liner that can solve your headache.

config.extraAllowedContent = 'a(!simple-button-plugin){*}[*]';

This will have the following effect:

  • a - Element you want to keep the in-line style.
  • !simple-button-plugin - The simple-button-plugin is a class name and ! forces the button to be matched.
  • {*} - Allows all style properties be allowed.
  • [*] - Allows all attributes be allowed.