'ckeditor 5 Disabling content filtering

I've notice when extracting the data from the editor it filters some classes and styles. I want to use the exact same styling as the editor uses.

So, i have 2 problems i need to solve.

  1. How can i prevent the filtering of classes and styles from happening.
  2. How can i extract the CSS to a separate file?

I know when using previous ckeditor versions you could have used the following to prevent it filtering:

config.allowedContent = true;


Solution 1:[1]

You can use the General HTML support plugin in CKEditor 5. More info in the docs

This is what I'm using to enable some features as per my needs. You can customize to your implementation.

ClassicEditor.create(richEditorElem, {
  htmlSupport: {
    allow: [
      {
        name: /^(div|ul|li|ol|a|button|p|h[1-6])$/,
        classes: true,
        styles: true
      }
    ]
  }
}).then( editor => {

}).catch( error => {
    console.error( error );
});

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Whip