diff --git a/README.md b/README.md index fe27e6008..d8e638e84 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,53 @@ # CKEditor 5 mathematical feature -This package is the best TeX-based math plugin for CKEditor 5. You can use it to insert, edit and view mathematical equation / formulas. This plugin supports MathJax, KaTeX and custom typesetting engines. +This is the best TeX-based mathematical plugin for CKEditor 5. You can use it to insert, edit and view mathematical equation and formulas. This plugin supports MathJax, KaTeX and custom typesetting engines. + +## Demo (todo) +[Link to classic editor demo](https://www.example.com) +[Link to inline editor demo](https://www.example.com) + +## Installation +Install plugin with NPM or Yarn +`npm install ckeditor5-math --save-dev` + +Add import into ckeditor.js file + +```js +import Mathematics from 'ckeditor5-math/src/math'; +``` + +Add it to builtinPlugins + +```js +InlineEditor.builtinPlugins = [ + // ... + Mathematics, + // ... +]; +``` + +__Add math button to toolbar__ and optional math config to default config + +```js +InlineEditor.defaultConfig = { + toolbar: { + items: [ + // ... + 'math', + // ... + ] + }, + // ... + math: { + engine: 'mathjax', + outputType: 'script', + forceOutputType: false + }, + // ... +}; +``` +### Copying plugin's theme for Lark +Copy __theme/ckeditor5-link__ folder from [https://github.com/isaul32/ckeditor5-theme-lark](https://github.com/isaul32/ckeditor5-theme-lark) to your lark theme repository fork. ## Supported input and output formats Supported input and output formats are: @@ -21,7 +68,7 @@ Supported input and output formats are: - Tested by using version __0.11.0__ - Doesn't support preview feature because __.ck-reset_all *__ css rules from ckeditor5-ui and ckeditor5-theme-lark breaks it. ### Custom -It's possible with _engine: (__equation__, __element__, __display__) => { ... }_ math config. +It's possible to implement with _engine: (__equation__, __element__, __display__) => { ... }_ math config. - __equation__ is equation in TeX format without delimiters - __element__ is DOM element reserved for rendering - __display__ is boolean. Typesetting should be inline when false @@ -34,10 +81,16 @@ InlineEditor.defaultConfig = { math: { engine: 'mathjax', // or katex or function (equation, element, display) => { ... } outputType: 'script', // or span - forceOutputType: false + forceOutputType: false // forces output to use outputType } // ... } ``` ## Styles -- Styles requires PostCSS like offical CKEditor plugins \ No newline at end of file +- Styles requires PostCSS like offical CKEditor plugins +- +## Todo +- AutoMath like AutoMediaEmbed +- Convert equation images to mathtex when paste from word +- Fix KaTex preview +- Make better way import lark theme for plugin \ No newline at end of file