Advanced text editors seems to provide text editing buttons within a textarea field, which can be similar to the bold, italics, quote and add picture buttons. I'm well aware of how to add text-editors (like wysiwig, tinymce etc.,) within a Content management systems(drupal, joomla), but I'm not sure whether we can add those APIs to our simple html pages that contains a textarea field.
Does any one have any clue on how to add those APIs??
Advanced text editors seems to provide text editing buttons within a textarea field, which can be similar to the bold, italics, quote and add picture buttons. I'm well aware of how to add text-editors (like wysiwig, tinymce etc.,) within a Content management systems(drupal, joomla), but I'm not sure whether we can add those APIs to our simple html pages that contains a textarea field.
Does any one have any clue on how to add those APIs??
Share Improve this question asked Dec 8, 2014 at 8:00 girigiri 2,8342 gold badges27 silver badges27 bronze badges 1- 3 Read the instructions on the library webpages, and look at how the basic demo works. – Samuel Liew Commented Dec 8, 2014 at 8:12
2 Answers
Reset to default 9Use Quill - A cross browser rich text editor with an API.
From the docs:
<!-- Create the toolbar container -->
<div id="toolbar">
<button class="ql-bold">Bold</button>
<button class="ql-italic">Italic</button>
</div>
<!-- Create the editor container -->
<div id="editor">
<div>Hello World!</div>
</div>
<!-- Include the Quill library -->
<script src="http://quilljs./js/quill.js"></script>
<!-- Initialize Quill editor -->
<script>
var editor = new Quill('#editor');
editor.addModule('toolbar', { container: '#toolbar' });
</script>
<!DOCTYPE html>
<html>
<head>
<script src="//cdn.tinymce./4/tinymce.min.js"></script>
<script>tinymce.init({ selector:'textarea' });</script>
</head>
<body>
<textarea>Easy! You should check out MoxieManager!</textarea>
</body>
</html>
Copy & paste the snippet below into your HTML page