Created
March 7, 2023 08:23
-
-
Save sankalpdeveloper/e916e29a9e69670d0c60fcabacc2587c to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { Editor } from '@tinymce/tinymce-react'; | |
| const editorRef = useRef(null); | |
| const log = () => { | |
| if (editorRef.current) { | |
| console.log(editorRef.current.getContent()); | |
| } | |
| }; | |
| log() | |
| < Editor | |
| apiKey = '99zqvdg98uhoa5lc5r5it7xkl9u7wi2cu997xoh40l8lntls' | |
| onInit = {(evt, editor) => | |
| editorRef.current = editor | |
| } | |
| initialValue = "<p>This is the initial content of the editor.</p>" | |
| init = {{ | |
| plugins: 'preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media template codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount help charmap quickbars emoticons', | |
| editimage_cors_hosts: [], | |
| menubar: 'file edit view insert format tools table help', | |
| toolbar: 'undo redo | bold italic underline strikethrough | fontfamily fontsize blocks | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | forecolor backcolor removeformat | pagebreak | charmap emoticons | fullscreen preview save print | insertfile image media template link anchor codesample | ltr rtl', | |
| toolbar_sticky: true, | |
| toolbar_sticky_offset: isSmallScreen ? 102 : 108, | |
| autosave_ask_before_unload: true, | |
| autosave_interval: '30s', | |
| autosave_prefix: '{path}{query}-{id}-', | |
| autosave_restore_when_empty: false, | |
| autosave_retention: '2m', | |
| image_advtab: true, | |
| link_list: [ | |
| { title: 'My page 1', value: 'https://www.tiny.cloud' }, | |
| { title: 'My page 2', value: 'http://www.moxiecode.com' } | |
| ], | |
| image_list: [ | |
| { title: 'My page 1', value: 'https://www.tiny.cloud' }, | |
| { title: 'My page 2', value: 'http://www.moxiecode.com' } | |
| ], | |
| image_class_list: [ | |
| { title: 'None', value: '' }, | |
| { title: 'Some class', value: 'class-name' } | |
| ], | |
| importcss_append: true, | |
| file_picker_callback: (callback, value, meta) => { | |
| /* Provide file and text for the link dialog */ | |
| if (meta.filetype === 'file') { | |
| callback('https://www.google.com/logos/google.jpg', { text: 'My text' }); | |
| } | |
| /* Provide image and alt text for the image dialog */ | |
| if (meta.filetype === 'image') { | |
| callback('https://www.google.com/logos/google.jpg', { alt: 'My alt text' }); | |
| } | |
| /* Provide alternative source and posted for the media dialog */ | |
| if (meta.filetype === 'media') { | |
| callback('movie.mp4', { source2: 'alt.ogg', poster: 'https://www.google.com/logos/google.jpg' }); | |
| } | |
| }, | |
| templates: [ | |
| ], | |
| template_cdate_format: '[Date Created (CDATE): %m/%d/%Y : %H:%M:%S]', | |
| template_mdate_format: '[Date Modified (MDATE): %m/%d/%Y : %H:%M:%S]', | |
| height: 600, | |
| image_caption: true, | |
| quickbars_selection_toolbar: 'bold italic | quicklink h2 h3 blockquote quickimage quicktable', | |
| noneditable_class: 'mceNonEditable', | |
| toolbar_mode: 'sliding', | |
| contextmenu: 'link image table', | |
| skin: useDarkMode ? 'oxide-dark' : 'oxide', | |
| content_css: useDarkMode ? 'dark' : 'default', | |
| content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }' | |
| }} | |
| /> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment