Skip to content

docs: Base concepts page - closer to native English #2795

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: next
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 8 additions & 8 deletions example/example-popup.html
Original file line number Diff line number Diff line change
Expand Up @@ -31,33 +31,33 @@
<div class="stub">
<h1>Base concepts</h1>
<p>
Editor.js is a block-style editor for rich media stories. It outputs clean data in JSON instead of heavy HTML markup. And more important thing is that Editor.js is designed to be API extendable and pluggable.
Editor.js is a block-style editor for rich media stories. It outputs clean data in JSON instead of heavy HTML markup. Importantly, Editor.js is designed to be API extendable and pluggable.
</p>
<p>
So there are a few key features:
Key features:
</p>
<ul>
<li>Clean data output</li>
<li>API pluggable</li>
<li>Open source</li>
</ul>
<h2>
What does it mean block-styled
What does block-style mean
</h2>
<p>
In other editors, the workspace is provided by single contenteditable element in where you can create different HTML markup. All of us saw permanent bugs with moving text fragments or scaling images, while page parts are jumping and twitches. Or highlighting big parts of the text in the case when you just want to make few words to be a heading or bold.
In other editors, the workspace is provided by a single contenteditable element in which you can create and modify HTML markup. This results in bugs with moving text fragments or scaling images, while page parts are jumping and twitches. Or highlighting big parts of the text in the case when you just want to make few words to be a heading or bold.
</p>
<p>
The Editor.js workspace consists of separate Blocks: paragraphs, headings, images, lists, quotes, etc. Each of them is an independent contenteditable element (or more complex structure) provided by Plugin and united by Editor's Core.
</p>
<p>
At the same time, most useful features as arrow-navigation, copy & paste, cross block selection, and others works almost as in the familiar editors.
Useful editor features such as arrow-navigation, copy & paste, cross block selection, and others work as they do in popular editors.
</p>
<h2>
What is clean data
</h2>
<p>
But the more interesting thing is, as mentioned above, that Editor.js returns clean data instead of HTML-markup. Take a look at the example.
Editor.js returns clean data instead of HTML-markup. Take a look at the example.
</p>
<p>
If our entry consists of few paragraphs and a heading, in popular Medium editor after saving we will have something like this:
Expand All @@ -72,7 +72,7 @@ <h2>
Also, the clean data can be useful for backend processing: sanitizing, validation, injecting an advertising or other stuff, extracting Headings, make covers for social networks from Image Blocks, and other.
</p>
<h2>
API pluggable?
API pluggable
</h2>
<p>
A key value of the Editor is the API. All main functional units of the editor — Blocks, Inline Formatting Tools, Block Tunes — are provided by external plugins that use Editor's API.
Expand All @@ -84,7 +84,7 @@ <h2>
At the same time, API is created to be easy-to-understand and simple-to-use.
</p>
<h2>
Open Source, so?
Open Source
</h2>
<p>
Editor.js is more than just an editor. It is a big open-source community of developers and contributors. Anyone can suggest an improvement or a bug fix. Anyone can create new cool API features and plugins.
Expand Down