tinymce.html 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. {% assign id = include.id | default: 'mytextarea' %}
  2. <form method="post">
  3. <textarea id="tinymce-{{ id }}">Hello, <b>Tabler</b>!</textarea>
  4. </form>
  5. {% comment %}
  6. {% capture_global scripts %}
  7. <script>
  8. // @formatter:off
  9. document.addEventListener("DOMContentLoaded", function () {
  10. let options = {
  11. selector: '#tinymce-{{ id }}',
  12. height: 300,
  13. menubar: false,
  14. statusbar: false,
  15. plugins: [
  16. 'advlist autolink lists link image charmap print preview anchor',
  17. 'searchreplace visualblocks code fullscreen',
  18. 'insertdatetime media table paste 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 %}
  35. {% endcomment %}