How to save structure of site/document created with a rich text editor to create read-only views and editable rich text editors again? : <p>I need to save some content of an editor in some kind of backend, which currently is unspecified. At the moment I´m struggling the structure of the created document. In the editor the user should be able to write text and place videos or images without an fixed structure of how the images and text should be placed. The user should place these 3 components in any order he wants underneath each other.</p>

<p>In practice the editor looks something like this:
<a href="https://i.stack.imgur.com/uLlhG.png" rel="noreferrer"><img src="https://i.stack.imgur.com/uLlhG.png" alt="Text and images in any order"></a></p>

<p><strong>Q: How is it possible to save the structure, to load the exact same editor the next time or to create read-only<code>&lt;div&gt;</code> containers and editable rich text editors again with the content?</strong></p>

<p>My first idea was to split the editor in smaller sub-editors as soon as the type of content changes. So for example you are starting with only one editor with text. Then the user adds another editor (for example with an button click) and adds an image. But I´m not sure if the user accepts this and nevertheless puts all content (text and images) in the first editor.
<a href="https://i.stack.imgur.com/2eOrr.png" rel="noreferrer"><img src="https://i.stack.imgur.com/2eOrr.png" alt="Several Sub-editors with different contents"></a></p>

<hr>

<p>My second idea was to save the whole <code>html</code> created inside the editors code-view and to load it back inside the editor the next time the side is ordered. But I´m not sure if it´s possible this way to create "normal" read-only <code>&lt;div&gt;</code> containers with the same content.</p>

<p>In my opinion both of my ideas aren´t that good, so i´m asking you guys what you are suggesting to do.</p>
