8
0
Просмотр исходного кода

Docs: Added example how to create Balloon editor. [skip ci]

Wiktor Walc 8 лет назад
Родитель
Сommit
fcac189863
1 измененных файлов с 27 добавлено и 2 удалено
  1. 27 2
      docs/builds/guides/integration/basic-api.md

+ 27 - 2
docs/builds/guides/integration/basic-api.md

@@ -29,7 +29,7 @@ In your HTML page add an element that CKEditor should replace:
 </textarea>
 ```
 
-Then call {@link module:editor-classic/classiceditor~ClassicEditor#create `ClassicEditor.create()`} to replace `<textarea>` with a {@link builds/guides/overview#Classic-editor Classic editor}:
+Then call {@link module:editor-classic/classiceditor~ClassicEditor#create `ClassicEditor.create()`} to **replace** `<textarea>` with a {@link builds/guides/overview#Classic-editor Classic editor}:
 
 ```js
 ClassicEditor
@@ -54,7 +54,7 @@ Similarly to the previous example, add an element where CKEditor should initiali
 </div>
 ```
 
-Then call {@link module:editor-inline/inlineeditor~InlineEditor#create `InlineEditor.create()`} to attach {@link builds/guides/overview#Inline-editor Inline editor} to a `<div>` element:
+Then call {@link module:editor-inline/inlineeditor~InlineEditor#create `InlineEditor.create()`} to **attach** {@link builds/guides/overview#Inline-editor Inline editor} to a `<div>` element:
 
 ```js
 InlineEditor
@@ -67,6 +67,31 @@ InlineEditor
 	} );
 ```
 
+### Example – Balloon editor
+
+The procedure is the same as for Inline editor, the only difference is that we will use {@link module:editor-balloon/ballooneditor~BalloonEditor#create `BalloonEditor.create()`}.
+
+Add an element where CKEditor should initialize (as with ):
+
+```html
+<div id="editor">
+	&lt;p&gt;Here goes the initial content of the editor.&lt;/p&gt;
+</div>
+```
+
+Then call {@link module:editor-balloon/ballooneditor~BalloonEditor#create `BalloonEditor.create()`} to **attach** {@link builds/guides/overview#Balloon-editor Balloon editor} to a `<div>` element:
+
+```js
+BalloonEditor
+	.create( document.querySelector( '#editor' ) )
+	.then( editor => {
+		console.log( editor );
+	} )
+	.catch( error => {
+		console.error( error );
+	} );
+```
+
 <info-box tip>
 	Every editor class may accept different parameters in the `create()` method and may handle initialization differently. For instance, the classic editor will replace a given element with an editor, while the inline editor will use the given element to initialize the editor on it. See each editor's documentation to learn the details.