v0.2.10Published 4 years ago

This package has not had recent updates. Please investigate it's current state before committing to using it in your project.

Froala editor extension for babrahams:editable-text package

[//]: # (Example app:

[//]: # (Example app repo:

Quick Start

meteor add babrahams:editable-text-froala

(the Froala editor will get added automatically)

You can then drop an editable text widget into any Blaze template as follows:

{{> editableText collection="posts" field="text" editor="froala"}}

where "posts" is the name of the mongo collection and "text" is the name of a field in documents from the posts collection.

collection and field are mandatory parameters (and so is editor="froala" if you want the user to be able to edit the text field with the Froala editor).

Note: The widget assumes that the data context is that of a single document from the posts collection (with an _id value included).

You can also set the data context explicitly as follows:

{{> editableText context=singlePostDocument collection="posts" field="body"}}

where singlePostDocument can be a single document from the posts collection which is already set in the current context, or it can be provided by a template helper from the template that the widget was dropped into.

(You can use document, doc, object, obj, data or dataContext instead of context - go with whichever you prefer.)


Read the full documentation for the babrahams:editable-text package at

Note: there is currently only limited support in this package for the babrahams:editable-text API

The babrahams:editable-text widget params that are supported (so far) with the Froala editor are: class, style and acceptEmpty.

You can set default Froala editor options for this widget using EditableText.defaultFroalaOptions. E.g.

EditableText.defaultFroalaOptions = {
  enter: $.FroalaEditor.ENTER_DIV

You can also set Froala editor options on a per-widget basis using editorOptions=editorOptions as a widget param, with this in a template helper:

  editorOptions: function () {
    return {
      enter: $.FroalaEditor.ENTER_DIV


This package is MIT licensed, but note that the Froala Editor (which is a dependency) has its own license. See:

If you don't get a Froala licence then, in a production app, you'll just see "Unlicensed Froala Editor" in a red box instead of the editor.