|
|
@@ -2,7 +2,7 @@
|
|
|
<html lang="en">
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
- <title>CKEditor 5 – decoupled document build – development sample</title>
|
|
|
+ <title>CKEditor 5 – document editor build – development sample</title>
|
|
|
<style>
|
|
|
body {
|
|
|
max-width: 800px;
|
|
|
@@ -12,7 +12,7 @@
|
|
|
</head>
|
|
|
<body>
|
|
|
|
|
|
-<h1>CKEditor 5 – decoupled document build – development sample</h1>
|
|
|
+<h1>CKEditor 5 – document editor build – development sample</h1>
|
|
|
|
|
|
<h2>The toolbar</h2>
|
|
|
<div class="toolbar-container"></div>
|
|
|
@@ -51,18 +51,18 @@
|
|
|
<script src="../build/ckeditor.js"></script>
|
|
|
<script>
|
|
|
const editorData = `<h2>Sample</h2>
|
|
|
- <p>This is an instance of the <a href="https://docs.ckeditor.com/ckeditor5/latest/builds/guides/overview.html#document-editor">decoupled document build</a>.</p>
|
|
|
+ <p>This is an instance of the <a href="https://docs.ckeditor.com/ckeditor5/latest/builds/guides/overview.html#document-editor">document editor build</a>.</p>
|
|
|
<figure class="image">
|
|
|
<img src="../tests/manual/sample.jpg" alt="Autumn fields" />
|
|
|
</figure>
|
|
|
<p>You can use this sample to validate whether your <a href="https://docs.ckeditor.com/ckeditor5/latest/builds/guides/development/custom-builds.html">custom build</a> works fine.</p>`;
|
|
|
|
|
|
- DecoupledDocumentEditor.create( editorData, {
|
|
|
- toolbarContainer: document.querySelector( '.toolbar-container' ),
|
|
|
- editableContainer: document.querySelector( '.editable-container' )
|
|
|
- } )
|
|
|
+ DecoupledDocumentEditor.create( editorData )
|
|
|
.then( editor => {
|
|
|
window.editor = editor;
|
|
|
+
|
|
|
+ document.querySelector( '.toolbar-container' ).appendChild( editor.ui.view.toolbar.element );
|
|
|
+ document.querySelector( '.editable-container' ).appendChild( editor.ui.view.editable.element );
|
|
|
} )
|
|
|
.catch( err => {
|
|
|
console.error( err.stack );
|