<body>
<textarea id="editor">
<section class="cover">
<header class="editable">
<img src="https://images.ctfassets.net/s600jj41gsex/2lGbhNz04fmwkpjH9wVNxJ/1ea0346b8e3d0372e3036254b501277f/template-document-logo_2x.png" alt="demo document logo with triangle shapes" id="logo0A">
</header>
<main>
<h1>Project proposal template</h1>
<p class="editable">Mini-report content.</p>
<footer>
<p><small>Confidential</small></p>
</footer>
</main>
</section>
</textarea>
</body>
tinymce.init({
selector: '#editor',
height: 500,
plugins: [
'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'code', 'preview',
'anchor', 'searchreplace', 'visualblocks', 'code', 'fullscreen',
'insertdatetime', 'media', 'table', 'editimage', 'wordcount'
],
toolbar: 'undo redo | styles | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | code',
width: '500',
toolbar_mode: 'wrap',
width: '600',
editable_root: false,
editable_class: 'editable',
content_style: `
body {
background-color: #fed330;
padding: 1rem;
}
`,
});
This Pen doesn't use any external CSS resources.