@ckeditor/ckeditor5-html-support

What is @ckeditor/ckeditor5-html-support?

@ckeditor/ckeditor5-html-support is a plugin for CKEditor 5 that allows you to work with raw HTML content. It provides the ability to handle custom HTML elements and attributes, making it easier to integrate CKEditor 5 into applications that require advanced HTML support.

What are @ckeditor/ckeditor5-html-support's main functionalities?

Enabling HTML Support

This code demonstrates how to enable the HTML support plugin in CKEditor 5. By adding `HtmlSupport` to the `extraPlugins` array, you can start working with raw HTML content within the editor.

ClassicEditor.create(document.querySelector('#editor'), { extraPlugins: [HtmlSupport] })

Allowing Custom Elements

This code shows how to configure the editor to allow custom HTML elements, attributes, classes, and styles. In this example, the `div` element is allowed with all its attributes, classes, and styles.

ClassicEditor.create(document.querySelector('#editor'), { htmlSupport: { allow: [{ name: 'div', attributes: true, classes: true, styles: true }] } })

Disallowing Specific Elements

This code demonstrates how to disallow specific HTML elements. In this example, the `script` element is disallowed, preventing users from adding script tags to the content.

ClassicEditor.create(document.querySelector('#editor'), { htmlSupport: { disallow: [{ name: 'script' }] } })

Other packages similar to @ckeditor/ckeditor5-html-support

draft-js

Draft.js is a JavaScript rich text editor framework, built for React. It allows for extensive customization and supports raw HTML content through its ContentState and RawDraftContentState structures. Compared to @ckeditor/ckeditor5-html-support, Draft.js offers more flexibility for React applications but requires more setup and configuration.

quill

Quill is a modern WYSIWYG editor built for compatibility and extensibility. It supports custom HTML elements and attributes through its Delta format and Parchment library. Quill is easier to set up compared to @ckeditor/ckeditor5-html-support but may not offer the same level of integration with CKEditor 5's advanced features.

tinymce

TinyMCE is a popular rich text editor that provides extensive HTML support, including custom elements and attributes. It offers a wide range of plugins and configuration options. TinyMCE is comparable to @ckeditor/ckeditor5-html-support in terms of functionality but may have a steeper learning curve for new users.

README

CKEditor 5 HTML Support feature

This package implements the General HTML Support feature for CKEditor 5. It allows enabling unsupported HTML features in the rich-text editor at low cost.

Demo

Check out the demo in the General HTML Support feature guide.

Documentation

See the @ckeditor/ckeditor5-html-support package page as well as the General HTML Support feature guide in CKEditor 5 documentation.

Installation

npm install ckeditor5

License

Licensed under the terms of GNU General Public License Version 2 or later. For full details about the license, please check the LICENSE.md file or https://ckeditor.com/legal/ckeditor-oss-license.