# CKEditor 5 editor generated with the online builder

This repository presents a CKEditor 5 editor build generated by the [Online builder tool](https://ckeditor.com/ckeditor-5/online-builder)
with code block

# how to use

1. Run `npm install ckeditor';

## Open your component in angular project 

1. Then `import * as Editor from '../../../assets/ckeditor5/build/ckeditor.js';`

2  Then  `public Editor = ClassicEditor;`

3 in your configuration you could set-up you configuration as you want 

```js
editorConfig = {
         toolbar: {
             items: [
                 'bold',
                 'italic',
                 'link',
                 'bulletedList',
                 'numberedList',
                 '|',
                 'indent',
                 'outdent',
                 '|',
                 'codeBlock',
                 'imageUpload',
                 'blockQuote',
                 'insertTable',
                 'undo',
                 'redo',
             ]
         },
         image: {
             toolbar: [
                 'imageStyle:full',
                 'imageStyle:side',
                 '|',
                 'imageTextAlternative'
             ]
         },
         table: {
             contentToolbar: [
                 'tableColumn',
                 'tableRow',
                 'mergeTableCells'
             ]
         },
         // This value must be kept in sync with the language defined in webpack.config.js.
         language: 'en',
     };
```

# Open your view 

```html
<ckeditor  placeholder="Body" [config]="editorConfig" [(ngModel)]="body" [editor]="Editor" data="<p>Hello, csharp corner!</p><br/><br/> <b>This is demo for ckeditor 5 with angular 8</br>"></ckeditor>
```