Include Jodit and and the CDN Font Awesome
Copy<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" /> <link rel="stylesheet" href="build/jodit.min.css" /> <script src="build/jodit.min.js"></script>
Create input element
Copy<textarea id="editor">Some text</textarea>
And define evnet getIcon
Copyvar editor = new Jodit('#editor', { events: { getIcon: function (name, control, clearName) { var code = name; // not all font awesome icons is matched to Jodit icons switch (clearName) { case 'redo': code = 'rotate-right'; break; } return ( '<i style="font-size:14px" class="fa fa-' + code + ' fa-xs"></i>' ); } } });
For full replacing you can copy this code:
Copyvar editor = Jodit.make('#editor', { events: { getIcon: function (name, control, clearName) { var code = clearName; switch (clearName) { case 'redo': code = 'rotate-right'; break; case 'video': code = 'video-camera'; break; case 'copyformat': code = 'clone'; break; case 'about': code = 'question'; break; case 'selectall': code = 'legal'; break; case 'symbol': return '<span style="text-align: center;font-size:14px;">Ω</span>'; case 'hr': code = 'minus'; break; case 'left': case 'right': case 'justify': case 'center': code = 'align-' + name; break; case 'brush': code = 'tint'; break; case 'fontsize': code = 'text-height'; break; case 'ul': case 'ol': code = 'list-' + name; break; case 'source': code = 'code'; break; } return ( '<i style="font-size:14px" class="fa fa-' + code + ' fa-xs"></i>' ); } } });