Tinymce là gì

TinyMCE là 1 trong những nền tảng tự do dựa bên trên Javascript HTML WYSIWYG được vạc hành bởi LGPL web. Nó cung ứng một trình biên soạn thảo văn bản HTML, có thiết kế để dễ dàng hóa việc tạo ra nội dung web. Nó giúp bọn họ dễ dàng chỉnh sửa định dạng hầu như đoạn văn bạn dạng như blog, description... Không dừng lại ở đó nó cũng hoàn toàn miễn phí

TinyMCE được vận dụng và sử dụng trong không hề ít ngôn ngữ, việc cài đặt bằng phương pháp tải package về hoặc thiết lập bằng dòng lệnh bên trên terminal.Trong nội dung bài viết này bản thân sẽ ứng dụng TinyMCE trong framework ExpressJS.

2.1. Sở hữu đặt.

Chúng mình sẽ thiết lập TinyMCE qua Bower - công cụ cai quản các nguồn tài nguyên cho việc lập trình font-end. Được cách tân và phát triển và xuất hiện Source vì Twitter.Nếu các bạn nào không rõ lắm về cách cài đặt và sử dụng npm thì hoàn toàn có thể tham khảo tại bài viết :https://trungquandev.com/toi-da-su-dung-bower-de-quan-ly-cac-thu-vien-code-nhu-the-nao/

Thêm TinyMCE vào project của bản thân mình bằng câu lệnh:

bower install tinymce

2.2.Sử dụng.

Xem thêm: Nguyên Lý Hoạt Động Của Sắc Ký Khí Là Gì, Phương Pháp Sắc Ký Khí

script src="https://90namdangbothanhhoa.vn/bower/tinymce/tinymce.min.js"> tinymce.init( selector: "#content" ); script>Khi thiết lập xong bower thì sẽ hiện ra trong project của chúng ta file .bowerrc và trong những số ấy ta config băng thông khi họ bower về thì package này sẽ nằm làm việc đâu. Thì tại đây trong file .bowerrc mình config tất cả các package lúc bower về sẽ nằm ở vị trí public/bower ..bowerrc

"directory": "public/bower"Đoạn code

tinymce.init( selector: "#content" );Dùng nhằm init TinyMCE , #content là id của thẻ .Với 1 thao tác làm việc nhúng đoạn script đơn giản như vậy , chúng mình sẽ tiến hành giao diện TinyMCE như sau :
script> script type="text/javascript"> tinymce.init( selector: "#content", plugins: "image code", image_title: true, automatic_uploads: true, file_picker_types: "image", file_picker_callback: function(cb, value, meta) var đầu vào = document.createElement("input"); input.setAttribute("type", "file"); input.setAttribute("accept", "image/*"); input.onchange = function () var file = this.files; var reader = new FileReader(); reader.onload = function () var id = "blobid" + (new Date()).getTime(); var blobCache = tinymce.activeEditor.editorUpload.blobCache; var base64 = reader.result.split(","); var blobInfo = blobCache.create(id, file, base64); blobCache.add(blobInfo); cb(blobInfo.blobUri(), title: file.name); ; reader.readAsDataURL(file); ; input.click(); ); script>Sau đó là hình hình ảnh demo.

Trên trên đây mình đã giới thiệu về TinyMCE tương tự như là cách thực hiện plugin trong TinyMCE. TinyMCE dễ setup và sử dụng, có rất nhiều tùy chọn. Mong để giúp đỡ ích được cho các bạn.

Xem thêm: Diễn Viên Thùy Dương: Hướng Dương Ngược Nắng Gần Đến Hồi Kết, Mẹ Cami Đã Lộ Diện?

https://www.tinymce.com/docs/plugins/https://www.tinymce.com/docs/demo/file-picker/