Nhúng tinyMCE vào dự án Ruby on Rails

Lượt xem: 623

Để giúp người dùng thuận tiện trong việc soạn thảo nội dung thay vì dùng textarea chúng ta nhúng tinyMCE vào dự án của chúng ta. Giúp người dùng có thể căn chỉnh thuận tiện hơn.

Cách 1: Bạn có thể nhúng trực tiếp thông qua cdn của tinyMCE bằng cách thêm đoạn code sau vào head trong file application.html.erb


<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
 <script>
   tinymce.init({
     selector: '.tinymce',
     height: 500,
     menubar: false,
     plugins: [
       'advlist autolink lists link image charmap print preview anchor',
       'searchreplace visualblocks code fullscreen',
       'insertdatetime media table paste code help wordcount'
     ],
       toolbar: 'undo redo | formatselect | ' +
       ' bold italic backcolor | alignleft aligncenter ' +
       ' alignright alignjustify | bullist numlist outdent indent | ' +
       ' removeformat | help'
   });
 </script>

Cách 2: Bạn sử dụng gem tinymce-rails

Video

 

Tài liệu tham khảo

https://www.tiny.cloud/docs/integrations/rails/

https://github.com/spohlenz/tinymce-rails