tinymce split view |
tinymce split view |
aristosv |
Jan 31 2021, 10:23 AM
Post
#1
|
Group: Members Posts: 1 Joined: 31-January 21 Member No.: 27,760 |
I just set up tinymce for the first time, and I really like how you can configure it just the way you want to.
What I am trying to do now, is create a split view. For example have the source code on the right, and the wysiwyg editor on the left. So I can preview the changes I make to the code in real time. This is the code I used to set up tinymce like I want it. CODE <!DOCTYPE html> <html> <head> <script src="https://cdn.tiny.cloud/1/key_goes_here/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script> </head> <body> <textarea> </textarea> <script> tinymce.init({ selector: 'textarea', height: '1000', width: '50%', plugins: 'charmap hr emoticons preview image link code autolink lists checklist media table', toolbar: 'undo redo | fontselect | fontsizeselect | bold italic underline | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent | forecolor backcolor | link image media | hr charmap emoticons | preview code | table', image_title: true, automatic_uploads: true, file_picker_types: 'image', file_picker_callback: function (cb, value, meta) { var input = document.createElement('input'); input.setAttribute('type', 'file'); input.setAttribute('accept', 'image/*'); input.onchange = function () { var file = this.files[0]; var reader = new FileReader(); reader.onload = function () { var id = 'blobid' + (new Date()).getTime(); var blobCache = tinymce.activeEditor.editorUpload.blobCache; var base64 = reader.result.split(',')[1]; var blobInfo = blobCache.create(id, file, base64); blobCache.add(blobInfo); cb(blobInfo.blobUri(), { title: file.name }); }; reader.readAsDataURL(file); }; input.click(); }, content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }', toolbar_mode: 'floating', }); </script> </body> </html> and this is what it looks like and this is what I want it to look like is this possible to do? |
Lo-Fi Version | Time is now: 24th September 2024 - 04:40 PM |