Live Code Preview
This example allows you to see when the contentChanged event is triggered and how the rich text editor's content appears outside the editable area.
Start typing and you can preview the code of the WYSIWYG HTML editor as you type below the editing box.
<p><img class="fr-fir fr-dii" src="../../img/photo1.jpg" alt="Old Clock" width="200"></p>
<h1>Live Code Preview</h1>
<p>This example allows you to see when the <a href="https://www.froala.com/wysiwyg-editor/v2.0/docs/events#contentChanged" title="contentChanged event" target="_blank">contentChanged</a> event is triggered and how the rich text editor's content appears
outside the editable area.</p>
<p>Start typing and you can preview the code of the WYSIWYG HTML editor as you type below the editing box.</p>
<p data-f-id="pbf" style="text-align: center; font-size: 14px; margin-top: 30px; opacity: 0.65; font-family: sans-serif;">Powered by <a href="https://www.froala.com/wysiwyg-editor?pb=1" title="Froala Editor">Froala Editor</a></p>