froala-editor
Version:
The next generation Javascript WYSIWYG HTML rich text editor made by devs for devs. High performance and modern design make it easy to use for developers and loved by users.
55 lines (45 loc) • 1.64 kB
HTML
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.0.2/css/material-design-iconic-font.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="../../css/froala_editor.css">
<link rel="stylesheet" href="../../css/froala_style.css">
<link rel="stylesheet" href="../../css/plugins/char_counter.css">
<style>
body {
text-align: center;
}
section {
width: 81%;
margin: auto;
text-align: left;
}
</style>
</head>
<body>
<section id="editor">
<h1>Character Counter</h1>
<p>Using the <code>char_counter.min.js</code> plugin it is possible to limit the number of characters that can be
introduced into the WYSIWYG HTML editor.</p>
<div id='edit' style="margin-top: 30px;">
<p>You can type only 140 characters.</p>
<p>The maximum number of characters can be changed using the <a
href="https://www.froala.com/wysiwyg-editor/docs/options#charCounterMax"
title="charCounterMax">charCounterMax</a> option.</p>
</div>
</section>
<script type="text/javascript" src="../../js/froala_editor.min.js"></script>
<script type="text/javascript" src="../../js/plugins/char_counter.min.js"></script>
<script>
(function () {
new FroalaEditor("#edit", {
// Set maximum number of characters.
charCounterMax: 140
})
})()
</script>
</body>
</html>