All Projects → ckeditor → Ckeditor5

ckeditor / Ckeditor5

Licence: other
Powerful rich text editor framework with a modular architecture, modern integrations, and features like collaborative editing.

Programming Languages

javascript
184084 projects - #8 most used programming language
Rich Text Format
576 projects
HTML
75241 projects

Projects that are alternatives of or similar to Ckeditor5

Ckeditor4
The best enterprise-grade WYSIWYG editor. Fully customizable with countless features and plugins.
Stars: ✭ 5,502 (+1.78%)
Mutual labels:  rich-text-editor, contenteditable, wysiwyg, ckeditor, rte
Wysiwyg.js
wysiwyg contenteditable editor (minified+compression: 6kb)
Stars: ✭ 520 (-90.38%)
Mutual labels:  rich-text-editor, contenteditable, wysiwyg, wysiwyg-editor
am-editor
A rich text collaborative editor framework that can use React and Vue custom plug-ins. 一个富文本实时协同编辑器框架,可以使用React和Vue自定义插件。
Stars: ✭ 542 (-89.97%)
Mutual labels:  contenteditable, wysiwyg, rich-text-editor, wysiwyg-editor
Slate Plugins
🔌 Next-gen slate plugins
Stars: ✭ 399 (-92.62%)
Mutual labels:  rich-text-editor, contenteditable, wysiwyg, wysiwyg-editor
Megadraft
Megadraft is a Rich Text editor built on top of Facebook's Draft.JS featuring a nice default base of components and extensibility
Stars: ✭ 982 (-81.83%)
Mutual labels:  rich-text-editor, contenteditable, wysiwyg, wysiwyg-editor
Awesome Wysiwyg
A curated list of awesome WYSIWYG editors.
Stars: ✭ 1,801 (-66.69%)
Mutual labels:  rich-text-editor, contenteditable, wysiwyg, wysiwyg-editor
Pell
📝 the simplest and smallest WYSIWYG text editor for web, with no dependencies
Stars: ✭ 11,653 (+115.56%)
Mutual labels:  rich-text-editor, contenteditable, wysiwyg, wysiwyg-editor
Angular Editor
A simple native WYSIWYG editor component for Angular 6 -10+
Stars: ✭ 428 (-92.08%)
Mutual labels:  rich-text-editor, wysiwyg, wysiwyg-editor
textbus
Textbus 是一个组件化的、数据驱动的富文本框架,支持在线协同编辑,同时也可以作为一个开箱即用的富文本编辑器,拥有非常好的扩展性和可定制性,是构建复杂富文本的不二之选!
Stars: ✭ 642 (-88.12%)
Mutual labels:  wysiwyg, rich-text-editor, wysiwyg-editor
Trix
A rich text editor for everyday writing
Stars: ✭ 16,546 (+206.07%)
Mutual labels:  rich-text-editor, wysiwyg, wysiwyg-editor
wysiwyg-editor-dotnet-sdk
.NET SDK to ease the integration of Froala WYSIWYG Editor on server side.
Stars: ✭ 23 (-99.57%)
Mutual labels:  wysiwyg, rich-text-editor, wysiwyg-editor
typester
✒️ A WYSIWYG that gives you predictable and clean HTML
Stars: ✭ 29 (-99.46%)
Mutual labels:  wysiwyg, rich-text-editor, wysiwyg-editor
bangle.dev
Collection of higher level rich text editing tools. It powers the local only note taking app https://bangle.io
Stars: ✭ 541 (-89.99%)
Mutual labels:  wysiwyg, rich-text-editor, wysiwyg-editor
rtexteditorview
A simple WYSIWYG editor for Android
Stars: ✭ 51 (-99.06%)
Mutual labels:  wysiwyg, rich-text-editor, wysiwyg-editor
wysihtml5-rails
A wysiwyg text editor for use in the Rails asset pipeline
Stars: ✭ 28 (-99.48%)
Mutual labels:  wysiwyg, rich-text-editor, wysiwyg-editor
iOS-HTMLTextEditor
A simple implementation of an HTML Editor using CKEditor in a web view.
Stars: ✭ 57 (-98.95%)
Mutual labels:  wysiwyg, ckeditor, rich-text-editor
cazary
jQuery plugin of WYSIWYG editor that aims for fast, lightweight, stylish, customizable, cross-browser, and multi-language.
Stars: ✭ 12 (-99.78%)
Mutual labels:  wysiwyg, rich-text-editor, wysiwyg-editor
Awesome Web Editor
🔨 Open source WEB editor summary
Stars: ✭ 306 (-94.34%)
Mutual labels:  rich-text-editor, wysiwyg, wysiwyg-editor
Text
📑 Collaborative document editing using Markdown
Stars: ✭ 282 (-94.78%)
Mutual labels:  rich-text-editor, wysiwyg, wysiwyg-editor
wysiwyg-editor-php-sdk
PHP SDK to ease the integration of Froala WYSIWYG Editor on server side.
Stars: ✭ 37 (-99.32%)
Mutual labels:  wysiwyg, rich-text-editor, wysiwyg-editor

CKEditor 5 Tweet

npm version

Build Status Dependency Status devDependency Status

Join newsletter Follow twitter

A set of ready-to-use rich text editors created with a powerful framework. Made with real-time collaborative editing in mind.

CKEditor 5 Classic rich text editor build screenshot

Table of contents

Quick start

CKEditor 5 builds

CKEditor 5 builds are a set of ready-to-use rich text editors. Every "build" provides a single type of editor with a set of features and a default configuration.

The following CKEditor 5 builds are currently available:

Example

Creating an editor using a CKEditor 5 build is very simple and can be described in two steps:

  1. Load the desired editor via the <script> tag.
  2. Call the static create() method to create the editor.

In your HTML page add an element that CKEditor should replace:

<div id="editor"></div>

Load the classic editor build (you can choose between CDN, npm and zip downloads):

<script src="https://cdn.ckeditor.com/ckeditor5/<version>/classic/ckeditor.js"></script>

Call the ClassicEditor.create() method:

<script>
    ClassicEditor
        .create( document.querySelector( '#editor' ) )
        .catch( error => {
            console.error( error );
        } );
</script>

You’re ready to go!

To find out how to start with other builds check the Quick start guide in the CKEditor 5 documentation.

CKEditor 5 Framework

CKEditor 5 builds allow you to quickly and easily initialize one of the many types of editors in your application. At the same time, CKEditor 5 is also a framework for creating custom-made rich text editing solutions.

To find out how to start building your own editor from scratch go to CKEditor 5 Framework overview section of CKEditor 5 documentation.

Documentation and FAQ

To find out more see the following CKEditor 5 documentation sections:

The documentation is far from being complete and will be constantly evolving (as will the editor) until it is ready for v1.0.0.

For FAQ please go to the CKEditor Ecosystem help center. For a high-level overview of the project see the CKEditor Ecosystem website.

Contributing and project organization

Ideas and discussions

The development repository of CKEditor 5 is located at https://github.com/ckeditor/ckeditor5. This is the best place for bringing opinions and contributions. Letting the core team know if they are going in the right or wrong direction is great feedback and will be much appreciated!

Development

CKEditor 5 is a modular, multi-package, monorepo project. It consists of several packages that create the editing framework, based on which the feature packages are implemented.

The ckeditor5 repository is the place that centralizes the development of CKEditor 5. It bundles different packages into a single place, adding the necessary helper tools for the development workflow, like the builder and the test runner. Basic information on how to set up the development environment can be found in the documentation.

See the official contributors' guide to learn how to contribute your code to the project.

Reporting issues and feature requests

Each repository handles its issues independently. However, it is recommended to report issues in this repository unless you know to which specific repository the issue belongs.

Read more on the Support page.

Releases

See CKEditor 5 release blog posts on the CKEditor blog.

Packages

Core libraries

Name Version Description
@ckeditor/ckeditor5-engine @ckeditor/ckeditor5-engine npm package badge The editing engine.
@ckeditor/ckeditor5-core @ckeditor/ckeditor5-core npm package badge The core editor architecture.
@ckeditor/ckeditor5-ui @ckeditor/ckeditor5-ui npm package badge The editor UI library.
@ckeditor/ckeditor5-utils @ckeditor/ckeditor5-utils npm package badge The editor utilities library.
@ckeditor/ckeditor5-upload @ckeditor/ckeditor5-upload npm package badge The file upload utilities.
@ckeditor/ckeditor5-widget @ckeditor/ckeditor5-widget npm package badge The widget API.
@ckeditor/ckeditor5-watchdog @ckeditor/ckeditor5-watchdog npm package badge The watchdog feature, which keeps CKEditor 5 editors running.
@ckeditor/ckeditor5-cloud-services @ckeditor/ckeditor5-cloud-services npm package badge CKEditor 5's Cloud Services integration layer.

Builds

Name Version Description
@ckeditor/ckeditor5-build-classic @ckeditor/ckeditor5-build-classic npm package badge The classic editor build.
@ckeditor/ckeditor5-build-inline @ckeditor/ckeditor5-build-inline npm package badge The inline editor build.
@ckeditor/ckeditor5-build-balloon @ckeditor/ckeditor5-build-balloon npm package badge The balloon editor (Medium-like) build.
@ckeditor/ckeditor5-build-balloon-block @ckeditor/ckeditor5-build-balloon-block npm package badge The balloon editor with a block toolbar (Slack–like) build.
@ckeditor/ckeditor5-build-decoupled-document @ckeditor/ckeditor5-build-decoupled-document npm package badge The document editor build, featuring the decoupled UI editor implementation.

Features

Name Version Description
@ckeditor/ckeditor5-adapter-ckfinder @ckeditor/ckeditor5-adapter-ckfinder npm package badge The CKFinder adapter for features which require upload capabilities (e.g. image upload).
@ckeditor/ckeditor5-alignment @ckeditor/ckeditor5-alignment npm package badge The text alignment feature.
@ckeditor/ckeditor5-autoformat @ckeditor/ckeditor5-autoformat npm package badge The autoformatting feature. Replaces predefined characters with a corresponding format (e.g. **foo** becomes bold <strong>foo</strong>).
@ckeditor/ckeditor5-autosave @ckeditor/ckeditor5-autosave npm package badge The autosave feature. Makes it easy to automatically save the data to the backend.
@ckeditor/ckeditor5-basic-styles @ckeditor/ckeditor5-basic-styles npm package badge The bold, italic, underline and code features.
@ckeditor/ckeditor5-block-quote @ckeditor/ckeditor5-block-quote npm package badge The block quote feature.
@ckeditor/ckeditor5-ckfinder @ckeditor/ckeditor5-ckfinder npm package badge The CKFinder file browser integration.
@ckeditor/ckeditor5-clipboard @ckeditor/ckeditor5-clipboard npm package badge The clipboard integration.
@ckeditor/ckeditor5-code-block @ckeditor/ckeditor5-code-block npm package badge The code block feature.
@ckeditor/ckeditor5-enter @ckeditor/ckeditor5-enter npm package badge The Enter key feature.
@ckeditor/ckeditor5-easy-image @ckeditor/ckeditor5-easy-image npm package badge Easy Image with CKEditor Cloud Services feature.
@ckeditor/ckeditor5-find-and-replace @ckeditor/ckeditor5-find-and-replace npm package badge The find and replace feature.
@ckeditor/ckeditor5-font @ckeditor/ckeditor5-font npm package badge The font size and font family features.
@ckeditor/ckeditor5-heading @ckeditor/ckeditor5-heading npm package badge The heading feature.
@ckeditor/ckeditor5-highlight @ckeditor/ckeditor5-highlight npm package badge The highlight feature (markers and pens).
@ckeditor/ckeditor5-horizontal-line @ckeditor/ckeditor5-horizontal-line npm package badge The horizontal rule feature.
@ckeditor/ckeditor5-html-embed @ckeditor/ckeditor5-html-embed npm package badge The HTML embed feature.
@ckeditor/ckeditor5-html-support @ckeditor/ckeditor5-html-support npm package badge The General HTML Support feature.
@ckeditor/ckeditor5-image @ckeditor/ckeditor5-image npm package badge The image feature. Supports image styles, captioning, upload, resizing, and more.
@ckeditor/ckeditor5-indent @ckeditor/ckeditor5-indent npm package badge The indentation (of lists and blocks) feature.
@ckeditor/ckeditor5-language @ckeditor/ckeditor5-language npm package badge The text part language feature.
@ckeditor/ckeditor5-link @ckeditor/ckeditor5-link npm package badge The link feature.
@ckeditor/ckeditor5-list @ckeditor/ckeditor5-list npm package badge The numbered and bulleted lists feature.
@ckeditor/ckeditor5-markdown-gfm @ckeditor/ckeditor5-markdown-gfm npm package badge The GitHub-flavored Markdown data processor.
@ckeditor/ckeditor5-media-embed @ckeditor/ckeditor5-media-embed npm package badge The media embed feature.
@ckeditor/ckeditor5-mention @ckeditor/ckeditor5-mention npm package badge The mention feature (autocomplete `@mentions`, `#tags`, etc.).
@ckeditor/ckeditor5-page-break @ckeditor/ckeditor5-page-break npm package badge The page break feature.
@ckeditor/ckeditor5-paragraph @ckeditor/ckeditor5-paragraph npm package badge The paragraph feature.
@ckeditor/ckeditor5-paste-from-office @ckeditor/ckeditor5-paste-from-office npm package badge The Paste from Office (Word, Excel, Google Docs, etc.) plugin.
@ckeditor/ckeditor5-remove-format @ckeditor/ckeditor5-remove-format npm package badge The remove format feature.
@ckeditor/ckeditor5-restricted-editing @ckeditor/ckeditor5-restricted-editing npm package badge The restricted editing feature.
@ckeditor/ckeditor5-select-all @ckeditor/ckeditor5-select-all npm package badge The "select all" feature.
@ckeditor/ckeditor5-source-editing @ckeditor/ckeditor5-source-editing npm package badge The source editing feature.
@ckeditor/ckeditor5-special-characters @ckeditor/ckeditor5-special-characters npm package badge The special characters feature.
@ckeditor/ckeditor5-table @ckeditor/ckeditor5-table npm package badge The table feature.
@ckeditor/ckeditor5-typing @ckeditor/ckeditor5-typing npm package badge The typing and deleting features.
@ckeditor/ckeditor5-undo @ckeditor/ckeditor5-undo npm package badge The undo feature.
@ckeditor/ckeditor5-word-count @ckeditor/ckeditor5-word-count npm package badge The word count feature.

Editors

Name Version Description
@ckeditor/ckeditor5-editor-classic @ckeditor/ckeditor5-editor-classic npm package badge The classic editor implementation.
@ckeditor/ckeditor5-editor-inline @ckeditor/ckeditor5-editor-inline npm package badge The inline editor implementation.
@ckeditor/ckeditor5-editor-balloon @ckeditor/ckeditor5-editor-balloon npm package badge The balloon editor (Medium-like) implementation.
@ckeditor/ckeditor5-editor-decoupled @ckeditor/ckeditor5-editor-decoupled npm package badge The editor implementation with a decoupled UI.

Themes

Name Version Description
@ckeditor/ckeditor5-theme-lark @ckeditor/ckeditor5-theme-lark npm package badge The Lark theme.

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.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].