This is a text editor written in javascript.
Clone this repository and run npm install.
$ git clone [email protected]:k2con/masamo-text-editor.git
$ cd masamo-text-editor
$ npm installnpm run dev- start development server
Include the style sheet and javascript file in your html.
<head>
<!-- ... -->
<link rel="stylesheet" href="path/to/masamo-text-editor/style.css">
</head>
<body>
<!-- ... -->
<script src="path/to/masamo-text-editor/app.js"></script>
</body>Create a new instance of the editor.
const editor = new MasamoTextEditor({
// options
});- create MasamoTextEditor class
- create buildElement function to build the editor html
- MasamoTextEditor constructor generates the editor html and appends it to the passed element (the element is selected by the constructor. You can pass a selector string or an element object. Ex:
new MasamoTextEditor('#editor')) - add defalut options to the constructor
- add
useH1option. true as default. If true, the editor will use h1 as main heading, otherwise it will use h2. - format html code when user toggles the code view
- focus the ditor when it loads
- add a
pelement when editor is focused and it is empty - modularize the code
- get html from the editor with a method
- add
useCodeViewoption. false as default. If true, the editor will use code view as default. - add custom icons for the toolbar
- add emojis to the toolbar
- add custom fonts option
- improve the color picker
- improve the background color picker
- improve image upload
- allow images to be wheather uploaded or linked
- allow images to be aligned
- allow images to be resized
- add a link dialog instead of a prompt
- add table support
- add video support
- add custom css option
Contributions, issues and feature requests are welcome! Feel free to check issues page.
Please consider collaborating. It would be greatly appreciated.
To collaborate, read the contributing guide.
This project is MIT licensed.
Feel free to contact me if you have any questions.