Feature-rich WYSIWYG Markdown Editor Plugin with jQuery - MKEditor
| File Size: | 34.2 KB |
|---|---|
| Views Total: | 2470 |
| 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.











