jquery-froala-editor
Version:
A beautiful jQuery WYSIWYG HTML rich text editor. High performance and modern design make it easy to use for developers and loved by users.
55 lines (48 loc) • 1.46 kB
HTML
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
body {
text-align: center;
}
section {
width: 80%;
margin: auto;
text-align: left;
}
iframe {
width: 100%;
height: 400px;
}
</style>
</head>
<body>
<section id="editor">
<iframe src="content.html">
<p>Your browser does not support iframes.</p>
</iframe>
</section>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="../../js/froala_editor.min.js"></script>
<!--[if lt IE 9]>
<script src="../../js/froala_editor_ie8.min.js"></script>
<![endif]-->
<script src="../../js/plugins/tables.min.js"></script>
<script src="../../js/plugins/lists.min.js"></script>
<script src="../../js/plugins/colors.min.js"></script>
<script src="../../js/plugins/font_family.min.js"></script>
<script src="../../js/plugins/font_size.min.js"></script>
<script src="../../js/plugins/block_styles.min.js"></script>
<script src="../../js/plugins/media_manager.min.js"></script>
<script src="../../js/plugins/video.min.js"></script>
<script src="../../js/plugins/char_counter.min.js"></script>
<script>
$(function(){
$('iframe').load(function() {
$(this).contents().find('#edit').editable({inlineMode: false})
})
});
</script>
</body>
</html>