tinymce.html 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738
  1. {% assign id = include.id | default: 'mytextarea' %}
  2. <form method="post">
  3. <textarea id="tinymce-{{ id }}">Hello, <b>Tabler</b>!</textarea>
  4. </form>
  5. {% capture_global scripts %}
  6. <script>
  7. // @formatter:off
  8. document.addEventListener("DOMContentLoaded", function () {
  9. let options = {
  10. selector: '#tinymce-{{ id }}',
  11. height: 300,
  12. menubar: false,
  13. statusbar: false,
  14. license_key: 'gpl',
  15. plugins: [
  16. 'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'preview', 'anchor',
  17. 'searchreplace', 'visualblocks', 'code', 'fullscreen',
  18. 'insertdatetime', 'media', 'table', 'code', 'help', 'wordcount'
  19. ],
  20. toolbar: 'undo redo | formatselect | ' +
  21. 'bold italic backcolor | alignleft aligncenter ' +
  22. 'alignright alignjustify | bullist numlist outdent indent | ' +
  23. 'removeformat',
  24. content_style: 'body { font-family: -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI, Roboto, Helvetica Neue, sans-serif; font-size: 14px; -webkit-font-smoothing: antialiased; }'
  25. }
  26. if (localStorage.getItem("tablerTheme") === 'dark') {
  27. options.skin = 'oxide-dark';
  28. options.content_css = 'dark';
  29. }
  30. tinyMCE.init(options);
  31. })
  32. // @formatter:on
  33. </script>
  34. {% endcapture_global %}