The Open Source Web Editor
You Will Love

Experience

  • WYSIWYG

    Edtr.io is a WYSIWYG in-line web editor written in React. Content created with Edtr.io looks just like the final page - select any editable element on the page, edit it in-place or drag ’n’ drop it around.

  • Heavily Customizable

    Its plugin architecture makes Edtr.io lean AND adaptable to any use case at the same time.

  • Open Source

    Edtr.io is of course Open Source and has already been adopted by major providers of community created content like Serlo.org and Schul-Cloud.

Try for yourself: You may not have noticed, but you are already in edit mode! Just click anywhere in the text to edit or grab the d’n’d symbol on the side of the container to move content about the page. You can check out our Storybook for a more full-fledged example.

Didn't see the plugin for your use case? Fret not! Up to now, Edtr.io has been developed to suit an educational setting, but we are more than happy to expand functionalities for further use cases in the future. Dive right into the documentation.

Learn More

Edtr.io's plugin architecture makes it adapt to virtually any use case. Platform providers have full control over the available editing options. The Edtr.io project provides a lean core of basic functionalities. For Rich Text editing, we build on Slate.

Edtr.io is based on reusable React components. Implementing and integrating a plugin only requires a few lines of code. You decide how data gets persisted; the state is a normalized JSON object, no HTML is involved. Plugins support undo/redo out of the box.

Edtr.io has UX at heart. Our core implements a consistent user experience. Building plugins from reusable elements ensures a uniform look and feel. Integrating Edtr.io into an existing applications is simple: all functionalities are fully customizable, theming can be applied from ground up.

In-line editors provide an easy way to work on web content. Content creators work directly on elements, adding and changing them in-place. Everything just looks like the final page. Users do not need knowledge of markup languages or any special training.