Feature-rich WYSIWYG Markdown Editor Plugin with jQuery - MKEditor
File Size: | 34.2 KB |
---|---|
Views Total: | 2392 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

MKEditor is a simple yet robust jQuery plugin that helps you generates a WYSIWYG markdown editor from a textarea element.
Features:
- Uses Font Awesome 4 for editor icons.
- Word / character / line counters.
- Instant preview.
- Fullscreen mode.
- Smooth scrolling effect.
- i18n. Currently supports 'en' and 'fr'.
How to use it:
1. Insert the following snippets into your document. Note that the mkeditor.js
should be placed after jQuery JavaScript library but before the closing body tag.
<link rel="stylesheet" href="css/mkeditor.css"> <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="js/mkeditor.js"></script>
2. Load the required Font Awesome 4 for editor buttons.
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
3. Create a textarea with predefined markdown syntax on the webpage.
<textarea cols="100" placeholder="Placeholder" rows="10"> An h1 header ============ </textarea>
4. Call the plugin to turn the textarea
into a WYSIWYG markdown editor.
$('textarea').MKEditor();
5. Default configuration options.
$('textarea').MKEditor({ // placeholder placeholder: '', // fullscreen mode fullscreen: false, // 'en' or 'fr' language: 'en', // resizable resize: false, // fixed size fixed: true, // character limit limit: 0, // hide specific editor buttons hideBtn: [] });
This awesome jQuery plugin is developed by christopherfouquier. For more Advanced Usages, please check the demo page or visit the official website.