ESI-HTML-DOCX/ckeditor5-export
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
ckeditor5-export/sample/index.html

126 lines
5.1 KiB
HTML
Raw Normal View History

Initialize the repository using CKEditor 5 Package Generator.
2024-12-23 12:34:44 +07:00
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="icon" type="image/png" href="https://ckeditor.com/docs/ckeditor5/latest/assets/img/favicons/32x32.png"
sizes="32x32">
<meta charset="utf-8">
<title>CKEditor 5 – Development Sample</title>
<style>
body {
max-width: 800px;
margin: 20px auto;
}
</style>
</head>
<body>
<h1>CKEditor 5 – Development Sample</h1>
<div id="editor">
📄 ckeditor.svg for import-word
2024-12-30 10:36:38 +07:00
<figure class="image"><img src="data:image/svg+xml;base64,Cjxzdmcgdmlld0JveD0iMCAwIDIwIDIwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMTcuODI2IDE2Ljg0M2EuNzUuNzUgMCAwIDAtMS4xNTItLjk2TDE1LjUgMTcuMjlWMTJIMTR2NS4yOWwtMS4xNzQtMS40MDhhLjc1Ljc1IDAgMCAwLTEuMTUyLjk2bDIuMzQ2IDIuODE2YS45NS45NSAwIDAgMCAxLjQ2IDBsMi4zNDYtMi44MTVaIi8+CjxwYXRoIGQ9Im0xNCAwIDUgNC41djkuNzQxYTIuNzM3IDIuNzM3IDAgMCAwLTEuNS0uNjE3VjYuNWgtNXYtNWgtOHYzSDNWMGgxMVptMCAydjNoMy4zTDE0IDJaIi8+CjxwYXRoIGQ9Ik0zIDE3LjVoNi43NDZjLjEuMjIuMjMuNDI5LjM5MS42MjNsLjczMS44NzdIM3YtMS41WiIvPgo8cGF0aCBkPSJNOC41IDZhMS41IDEuNSAwIDAgMSAxLjQ5MyAxLjM1NkwxMCA3LjV2N2ExLjUgMS41IDAgMCAxLTEuMzU2IDEuNDkzTDguNSAxNmgtN2ExLjUgMS41IDAgMCAxLTEuNDkzLTEuMzU2TDAgMTQuNXYtN2ExLjUgMS41IDAgMCAxIDEuMzU2LTEuNDkzTDEuNSA2aDdaTTcuNDgzIDguNzk1bC0uMDQyLjA4OC0uOTg2IDIuNTM0LS45NDctMi41MjgtLjA0My0uMDkyYS42MDEuNjAxIDAgMCAwLTEuMDQyLjAwOGwtLjA0Mi4wOTMtLjg4MyAyLjQ2NS0uOTM3LTIuNDc1LS4wNDItLjA4OWEuNi42IDAgMCAwLTEuMTA3LjQybC4wMjcuMDkzIDEuNTE0IDQgLjA0NC4wOTJhLjYuNiAwIDAgMCAxLjA0MS0uMDFsLjA0MS0uMDkyLjg4LTIuNDU4LjkyNSAyLjQ2Ny4wNDYuMDk2YS42LjYgMCAwIDAgMS4wMzIgMGwuMDQzLS4wOSAxLjU1NC00IC4wMjgtLjA5M2EuNi42IDAgMCAwLTEuMTA0LS40M3YuMDAxWiIvPgo8L3N2Zz4K" alt="SVG Icon"></figure>
Initialize the repository using CKEditor 5 Package Generator.
2024-12-23 12:34:44 +07:00
<h2>Development environment</h2>
<p>
This is a demo of the <a
href="https://ckeditor.com/docs/ckeditor5/latest/builds/guides/overview.html#classic-editor">classic
editor
build</a> that loads your plugin (<code>Export</code>) generated by the
tool. You can modify this
sample and use it to validate whether a plugin or a set of plugins work fine.
</p>
<p>
<code>Export</code> inserts text into the editor. You can click the
CKEditor 5 icon in the toolbar and see the results.
</p>
<h3>Helpful resources</h3>
<ul>
<li>Architecture
<ul>
<li>
<a
href="https://ckeditor.com/docs/ckeditor5/latest/framework/guides/architecture/core-editor-architecture.html">Core
editor architecture</a>
</li>
</ul>
<ul>
<li>
<a
href="https://ckeditor.com/docs/ckeditor5/latest/framework/guides/architecture/editing-engine.html">The
editing engine</a>
</li>
</ul>
<ul>
<li>
<a
href="https://ckeditor.com/docs/ckeditor5/latest/framework/guides/architecture/ui-library.html">The
UI library</a>
</li>
</ul>
</li>
<li>
<a
href="https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/browser-compatibility.html">Browser
compatibility</a>
</li>
<li>
<a href="https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html">The error
codes</a>
</li>
<li><a href="https://ckeditor.com/docs/ckeditor5/latest/builds/guides/development/dll-builds.html">The DLL
builds</a></li>
</ul>
<h3>The directory structure</h3>
<p>
The code snippet below presents the directory structure.
</p>
<pre><code class="language-plaintext">.
├─ lang
│ └─ contexts.json # Entries used for creating translations.
├─ sample
│ ├─ dll.html # The editor initialized using the DLL builds. Check README for details.
│ ├─ index.html # The currently displayed file.
│ └─ ckeditor.ts # The editor initialization script.
├─ src
│ ├─ export.ts
│ ├─ augmentation.ts # Type augmentations for the `@ckeditor/ckeditor5-core` module. Read more in <a href="https://ckeditor.com/docs/ckeditor5/latest/api/module_core_plugincollection-PluginsMap.html">PluginsMap</a> and <a href="https://ckeditor.com/docs/ckeditor5/latest/api/module_core_commandcollection-CommandsMap.html">CommandsMap</a>.
│ ├─ index.ts # The modules exported by the package when using the DLL builds.
│ └─ **/*.ts # All TypeScript source files should be saved here.
├─ tests
│ ├─ export.ts
│ ├─ index.ts # Tests for the plugin.
│ └─ **/*.ts # All tests should be saved here.
├─ theme
│ ├─ icons
│ │ ├─ ckeditor.svg # The CKEditor 5 icon displayed in the toolbar.
│ │ └─ **/*.svg # All icon files should be saved here.
│ └─ **/*.css # All CSS files should be saved here.
├─ typings
│ └─ **/*.d.ts # Files containing type definitions.
├─ .editorconfig
├─ ...
├─ README.md
└─ tsconfig.json # TypeScript configuration file.</code></pre>
<h3>Reporting issues</h3>
<p>If you found a problem with CKEditor 5 or the package generator, please, report an issue:</p>
<ul>
<li><a href="https://github.com/ckeditor/ckeditor5/issues/new/choose">CKEditor 5</a></li>
<li><a href="https://github.com/ckeditor/ckeditor5-package-generator/issues/new">The package generator</a>
</li>
</ul>
</div>
<script src="./ckeditor.dist.js"></script>
</body>
</html>
Reference in New Issue Copy Permalink