Add WYSIWYG editor to your Meteor app.
-
Install
meteor add chroma:autoform-summernote
-
Install dependencies:
you can use any version of bootstrap, or summernote you like here are some examples:
meteor add twbs:bootstrap
meteor add fortawesome:fontawesome
meteor add chroma:summernote
- Create schema
var BookSchema = new SimpleSchema({
title: {
type: String,
label: "Title",
max: 200
},
content: {
type: String,
label: "Yet another poem",
autoform: {
afFieldInput: {
type: 'summernote',
class: 'editor', // optional
settings: // summernote options goes here (minHeight: and height: are useful)
// if you want to use cfs instead of base64 inlining your images
imageCollection='attachedImages'
// if using s3 provide at least a bucket, and maybe a subfolder
s3bucket='bucket name'
s3subfolder='offering'
}
}
}
});
-
Attach schema to your collection
Books.attachSchema(BookSchema)
-
Generate the form with
{{> quickform}}
or{{#autoform}}
{{> quickForm collection="Books" type="insert"}}
- Remember to sanitize the HTML on the server! Summernote doesn't do that, and even if it did, the client could always send HTML containing
<script>
tags.
See all available summernote options here.
See all available summernote calbacks here.
5.0.2
- S3 support5.0.0
- Initial publish for autoform 5.
the summernote project is here: https://github.com/summernote/summernote
this package uses code based on greenewolf's reactive summernote solution here: summernote/summernote#1064
yes, please.