20% Off All Froala Plans
Days
Hours
Minutes
Seconds
x

Froala Editor v4.3 is hereLEARN MORE

Pricing
Get Started
Skip to content

    Methods

    align.apply align.refresh button.addButtons button.bindCommands button.buildGroup button.buildList button.bulkRefresh button.hideActiveDropdowns button.refresh charCounter.count clean.html clean.invisibleSpaces clean.lists clean.tables codeView.get codeView.isActive codeView.toggle colors.back colors.background colors.text commands.bold commands.clearFormatting commands.indent commands.insertHR commands.italic commands.moreMisc commands.moreParagraph commands.moreRich commands.moreText commands.outdent commands.redo commands.selectAll commands.show commands.strikeThrough commands.subscript commands.superscript commands.moreTrackChanges commands.underline commands.undo core.getXHR core.injectStyle core.isEmpty core.sameInstance cursor.backspace cursor.del cursor.enter cursor.isAtEnd cursor.isAtStart destroy edit.disableDesign edit.isDisabled edit.off edit.on editInPopup.update embedly.add embedly.back embedly.get embedly.insert embedly.remove embedly.showInsertPopup emoticons.insert emoticons.setEmoticonCategory events.bindClick events.blurActive events.chainTrigger events.disableBlur events.enableBlur events.focus events.on events.trigger file.insert file.upload fontFamily.apply fontSize.apply format.apply format.applyStyle format.is format.remove format.removeStyle format.toggle forms.applyStyle fullscreen.isActive fullscreen.toggle helpers.isAndroid helpers.isBlackberry helpers.isIOS helpers.isMac helpers.isMobile helpers.isTouch helpers.isWindowsPhone helpers.sanitizeURL helpers.scrollLeft helpers.scrollTop html.cleanEmptyTags html.get html.getSelected html.insert html.set html.unwrap html.wrap image.align image.applyStyle image.display image.get image.insert image.remove image.setAlt image.setSize image.upload imageManager.hide imageManager.show inlineClass.apply inlineStyle.apply keys.ctrlKey keys.isArrow keys.isCharacter language.translate lineHeight.apply link.allSelected link.applyStyle link.get link.insert link.remove lists.format markdown.isEnabled markdown.refresh markdown.toggle markers.insert markers.insertAtPoint markers.place markers.remove markers.split modals.areVisible modals.create modals.get modals.hide modals.isVisible modals.show node.blockParent node.clearAttributes node.contents node.deepestParent node.hasClass node.hasFocus node.isBlock node.isDeletable node.isEditable node.isElement node.isEmpty node.isFirstSibling node.isLastSibling node.isList node.isVoid paragraphFormat.apply paragraphStyle.apply placeholder.hide placeholder.isVisible placeholder.refresh placeholder.show popups.areVisible popups.create popups.get popups.hide popups.hideAll popups.isVisible popups.onHide popups.onRefresh popups.refresh popups.setContainer popups.show position.getBoundingRect position.refresh quote.apply save.force save.reset save.save selection.blocks selection.clear selection.element selection.endElement selection.get selection.inEditor selection.info selection.isCollapsed selection.isFull selection.ranges selection.restore selection.save selection.setAfter selection.setAtEnd selection.setAtStart selection.setBefore selection.text size.refresh size.syncIframe snapshot.equal snapshot.get snapshot.restore spellChecker.toggle table.insert toolbar.disable toolbar.enable toolbar.hide toolbar.show toolbar.showInline tooltip.bind tooltip.hide tooltip.to track_changes.toggleTracking track_changes.getPendingChanges track_changes.showChanges track_changes.acceptAllChanges track_changes.rejectAllChanges track_changes.acceptSingleChange track_changes.rejectSingleChange undo.canDo undo.canRedo undo.reset undo.saveStep video.align video.display video.get video.insert video.remove video.setSize wordCounter.wordCount

    Align

    align.apply align.refresh

    align.apply (value)

    Returns: Object

    Set the alignment of the selected paragraphs.

    • value

      Type: String

      The alignment value: left, right, center or justify.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.align.apply('left');

})

    align.refresh ($btn)

    Returns: Object

    Refresh the alignment of the selected paragraphs.

    • $btn

      Type: DOM Object

      An button element of command.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.align.refresh();

})

    Button

    button.addButtons button.bulkRefresh button.buildList button.buildGroup button.bindCommands button.refresh button.hideActiveDropdowns

    button.addButtons ($btns)

    Returns:

    Adds buttons into existing toolbar.

    • $btns

      Type: Array

      An array of commands to add into buttons.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.button.addButtons();

})

    button.bulkRefresh ()

    Returns: Object

    Refreshes the state of the buttons in the toolbar.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.button.bulkRefresh();

})

    button.buildList (buttons)

    Returns: Object

    Builds a list of commands to a button list represented as a HTML string.

    • buttons

      Type: Array

      An array of commands to build into buttons.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.button.buildList();

})

    button.buildGroup ()

    Returns:

    Builds a list of commands to a button list represented as a HTML string.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.button.buildGroup();

})

    button.bindCommands ($el)

    Returns:

    Attaches the event callbacks.

    • $el

      Type: DOM Object

      An element object.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.button.bindCommands();

})

    button.refresh ($btn)

    Returns:

    Refreshes the state of active command/button.

    • $btn

      Type: DOM Object

      An button element of command.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.button.refresh();

})

    button.hideActiveDropdowns ($el)

    Returns:

    Hides all the active dropdowns.

    • $el

      Type: DOM Object

      A wrapper element object.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.button.hideActiveDropdowns();

})

    Char Counter

    charCounter.count

    charCounter.count ()

    Returns: Integer

    Returns the number of characters in the editor.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.charCounter.count();

})

    Clean

    clean.html clean.tables clean.lists clean.invisibleSpaces

    clean.html (dirty_html)

    Returns: String

    Cleans dirty HTML to clean HTML ready to be inserted into the editor.

    • dirty_html

      Type: String

      The HTML to be cleaned.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.clean.html('<p dummy="test">foo</p><p>bar</p>');

})

    clean.tables ()

    Returns:

    Cleans the tables.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.clean.tables();

})

    clean.lists ()

    Returns:

    Cleans the lists.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.clean.lists();

})

    clean.invisibleSpaces (dirty_html)

    Returns:

    Cleans the invisible spaces.

    • dirty_html

      Type: String

      Current HTML in the editor

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.clean.invisibleSpaces();

})

    Code View

    codeView.isActive codeView.get codeView.toggle

    codeView.isActive ()

    Returns: Boolean

    Find if code view mode is active.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.codeView.isActive();

})

    codeView.get ()

    Returns: String

    Get the HTML edited inside the code view mode.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.codeView.get();

})

    codeView.toggle ()

    Returns: Object

    Toggle between the code and text view.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.codeView.toggle();

})

    Colors

    colors.background colors.text colors.back

    colors.background (value)

    Returns: Object

    Set the background color of the selected text.

    • value

      Type: String

      The color to be set.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.colors.background('#001122');

})

    colors.text (value)

    Returns: Object

    Set the text color of the selected text.

    • value

      Type: String

      The color to be set.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.colors.text('#001122');

})

    colors.back ()

    Returns:

    Hides the color picker popup.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.colors.back();

})

    Commands

    commands.bold commands.clearFormatting commands.indent commands.insertHR commands.italic commands.outdent commands.redo commands.show commands.strikeThrough commands.subscript commands.superscript commands.underline commands.undo commands.selectAll commands.moreText commands.moreParagraph commands.moreRich commands.moreMisc commands.moreTrackChanges

    commands.bold ()

    Returns: Object

    Format the selected text as bold.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.bold();

})

    commands.clearFormatting ()

    Returns: Object

    Clean any formatting on the selected text.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.clearFormatting();

})

    commands.indent ()

    Returns: Object

    Indent more the selected paragraphs.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.indent();

})

    commands.insertHR ()

    Returns: Object

    Insert a horizontal line at the cursor position.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.insertHR();

})

    commands.italic ()

    Returns: Object

    Format the selected text as italic.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.italic();

})

    commands.outdent ()

    Returns: Object

    Indent less the selected paragraphs.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.outdent();

})

    commands.redo ()

    Returns: Object

    Executes the redo action.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.redo();

})

    commands.show ()

    Returns: Object

    Show the inline toolbar at the cursor position.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.show();

})

    commands.strikeThrough ()

    Returns: Object

    Format the selected text as strike through.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.strikeThrough();

})

    commands.subscript ()

    Returns: Object

    Format the selected text as subscript.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.subscript();

})

    commands.superscript ()

    Returns: Object

    Format the selected text as superscript.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.superscript();

})

    commands.underline ()

    Returns: Object

    Format the selected text as underline.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.underline();

})

    commands.undo ()

    Returns: Object

    Executes the undo action.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.undo();

})

    commands.selectAll ()

    Returns: Object

    Executes the selectAll action.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.selectAll();

})

    commands.moreText ()

    Returns: Object

    Show more text actions toolbar.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.moreText();

})

    commands.moreParagraph ()

    Returns: Object

    Show more paragraph actions toolbar.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.moreParagraph();

})

    commands.moreRich ()

    Returns: Object

    Show more rich text actions toolbar.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.moreRich();

})

    commands.moreMisc ()

    Returns: Object

    Show more miscellaneous actions toolbar.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.moreMisc();

})

    commands.moreRich ()

    Returns: Object

    Show more paragraph actions toolbar.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.moreRich();

})

    commands.moreTrackChanges ()

    Returns: Object

    Show more track changes actions toolbar.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.commands.moreTrackChanges();

})

    Core

    core.getXHR core.injectStyle core.isEmpty core.sameInstance

    core.getXHR (url, method)

    Returns: XMLHttpRequest

    Creates a XHR object with the specified parameters.

    • url

      Type: String

      A URL endpoint for an asynchronous request.

    • method

      Type: String

      The request method for the request.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.core.getXHR('http://google.com', 'GET');

})

    core.injectStyle (style)

    Returns: Object

    CSS style to be injected inside the iframe of the editor when the iframe option is used.

    • style

      Type: String

      CSS style.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.core.injectStyle(body{background:red});

})

    core.isEmpty ()

    Returns: Boolean

    Check if the editor is empty.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.core.isEmpty();

})

    core.sameInstance ($obj)

    Returns: Boolean

    Check if the both editor instances are same..

    • $obj

      Type: DOM Object

      Editor object

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.core.sameInstance();

})

    Cursor

    cursor.backspace cursor.enter cursor.del cursor.isAtEnd cursor.isAtStart

    cursor.backspace ()

    Returns: Object

    Trigger backspace action at the cursor position.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.cursor.backspace();

})

    cursor.enter (shift)

    Returns: Object

    Trigger enter action at the cursor position.

    • shift

      Type: Boolean

      The state of the SHIFT key.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.cursor.enter(true);

})

    cursor.del ()

    Returns: Object

    Trigger delete action at the cursor position.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.cursor.del();

})

    cursor.isAtEnd ()

    Returns: Boolean

    Find if the cursor is at the end.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.cursor.isAtEnd();

})

    cursor.isAtStart ()

    Returns: Boolean

    Find if the cursor is at the start.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.cursor.isAtStart();

})

    Edit

    edit.off edit.on edit.isDisabled edit.disableDesign

    edit.off ()

    Returns: Object

    Disable editor by removing the contenteditable attribute.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.edit.off();

})

    edit.on ()

    Returns: Object

    Enable editor by adding the contenteditable attribute.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.edit.on();

})

    edit.isDisabled ()

    Returns: Boolean

    Find if the edit is disabled.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.edit.isDisabled();

})

    edit.disableDesign ()

    Returns:

    Disables the edit functionality.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.edit.disableDesign();

})

    Edit In Popup

    editInPopup.update

    editInPopup.update ()

    Returns:

    Update the texts in popup.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.editInPopup.update();

})

    Embedly

    embedly.add embedly.back embedly.get embedly.insert embedly.remove embedly.showInsertPopup

    embedly.add (url)

    Returns:

    Add the embedly to editor.

    • url

      Type: String

      URL for the embedly.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.embedly.add('http://video.example.com/video/pFhkluiEW');

})

    embedly.back ()

    Returns:

    Hides the insert popup and shows inline menu for currently selected embedly.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.embedly.back();

})

    embedly.get ()

    Returns:

    Gets the currently embedly instance.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.embedly.get();

})

    embedly.insert ()

    Returns:

    Inserts the embedly into editor from popup.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.embedly.insert();

})

    embedly.remove ()

    Returns:

    Removes the currently selected embedly instance.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.embedly.remove();

})

    embedly.showInsertPopup ()

    Returns:

    Shows insert popup.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.embedly.showInsertPopup();

})

    Emoticons

    emoticons.insert emoticons.setEmoticonCategory

    emoticons.insert (emoticon, image)

    Returns: Object

    Insert an emoticon at the cursor position.

    • emoticon

      Type: String

      HTML for the emoticon to be inserted in the editor.

    • image

      Type: String

      Image to be inserted when the emoticonsUseImage option is enabled.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.emoticons.insert("&#x1f600;", "https://cdnjs.cloudflare.com/ajax/libs/emojione/2.0.1/assets/svg/1f601.svg");

})

    emoticons.setEmoticonCategory (categoryId)

    Returns:

    Insert an emoticon at the cursor position.

    • categoryId

      Type: String

      Category Id for the emoticons.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.emoticons.setEmoticonCategory();

})

    Events

    events.blurActive events.bindClick events.chainTrigger events.disableBlur events.enableBlur events.focus events.on events.trigger

    events.blurActive ()

    Returns: Boolean

    Check if blur events are active.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.events.blurActive();

})

    events.bindClick ($element, selector, handler)

    Returns:

    Binds the click event for given element.

    • $element

      Type: DOM Object

      Element to bind event on

    • selector

      Type: String

      DOM selector expression.

    • handler

      Type: Function

      Handler function for the event.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.events.bindClick(node, '.selector', function() { // event handler goes here. } );

})

    events.chainTrigger (name, param, [force])

    Returns: Object

    Trigger events and chain the pass the returned value between the assigned events.

    • name

      Type: String

      Event name.

    • param

      Type: Object

      An object with data to pass to the event.

    • force

      Type: Boolean

      Trigger the event when the editor is disabled.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.events.chainTrigger('html.get', 'foo html', false);

})

    events.disableBlur ()

    Returns: Object

    Disables the blur and focus events.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.events.disableBlur();

})

    events.enableBlur ()

    Returns: Object

    Enables the blur and focus events.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.events.enableBlur();

})

    events.focus ()

    Returns: Object

    Focus into the editor.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.events.focus();

})

    events.on (name, callback, [first])

    Returns: Object

    Register an event.

    • name

      Type: String

      The name of the event.

    • callback

      Type: Function

      The callback for the event.

    • first

      Type: Boolean

      Trigger the callback before already registered callbacks.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.events.on('keydown', function (e) { console.log (e.which); }, false);

})

    events.trigger (name, [args], [force])

    Returns: Object

    Triggers an event.

    • name

      Type: String

      The name of the event.

    • args

      Type: Array

      An array with arguments to pass over to the event handler.

    • force

      Type: Boolean

      Force the event to trigger even if the editor is disabled.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.events.trigger('keydown', [], true);

})

    File

    file.insert file.upload

    Returns: Object

    Insert the link to a file at the cursor position.

    • link

      Type: String

      The link the file.

    • text

      Type: String

      The text for the file.

    • response

      Type: Object

      The response from the server.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.file.insert('http://example.com/file.pdf', 'file.pdf', {link: 'http://example.com/file.pdf'});

})

    file.upload (files)

    Returns: Object

    Upload the passed file to the server.

    • files

      Type: Array

      An array with the files to be uploaded to the server. It is usually the value of a file input.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.file.upload([]);

})

    Font Family

    fontFamily.apply

    fontFamily.apply (value)

    Returns: Object

    Set the font family of the selected text.

    • value

      Type: String

      The value of the font family.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.fontFamily.apply('Arial,Helvetica');

})

    Font Size

    fontSize.apply

    fontSize.apply (value)

    Returns: Object

    Set the font size of the selected text.

    • value

      Type: String

      The value of the font size.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.fontSize.apply('12px');

})

    Format

    format.apply format.applyStyle format.is format.remove format.removeStyle format.toggle

    format.apply (tagName, attrs)

    Returns: Object

    Apply format for the selection or at the insertion point.

    • tagName

      Type: String

      A string with the name of a DOM element.

    • attrs

      Type: Object

      A hash with attributes for tagName.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.format.apply('strong', { class: 'foo' });

})

    format.applyStyle (prop, attrs)

    Returns: Object

    Apply style for the selection or at the insertion point.

    • prop

      Type: String

      A CSS property name.

    • attrs

      Type: Object

      CSS property value for prop parameter.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.format.applyStyle('font-size', '16px;');

})

    format.is (tagName, attrs)

    Returns: Boolean

    Check format for the selection or at the insertion point.

    • tagName

      Type: String

      A string with the name of a DOM element.

    • attrs

      Type: Object

      A hash with attributes for tagName.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.format.is('strong', { class: 'foo' });

})

    format.remove (tagName, attrs)

    Returns: Object

    Remove format for the selection or at the insertion point.

    • tagName

      Type: String

      A string with the name of a DOM element.

    • attrs

      Type: Object

      A hash with attributes for tagName.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.format.remove('strong', { class: 'foo' });

})

    format.removeStyle (prop)

    Returns: Object

    Remove style for the selection or at the insertion point.

    • prop

      Type: String

      A CSS property name.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.format.removeStyle('font-size');

})

    format.toggle (tagName, attrs)

    Returns: Object

    Toggle format for the selection or at the insertion point.

    • tagName

      Type: String

      A string with the name of a DOM element.

    • attrs

      Type: Object

      A hash with attributes for tagName.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.format.toggle('strong', { class: 'foo' });

})

    Fullscreen

    fullscreen.isActive fullscreen.toggle

    fullscreen.isActive ()

    Returns: Boolean

    Check the fullscreen state.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.fullscreen.isActive();

})

    fullscreen.toggle ()

    Returns: Object

    Toggle fullscreen mode.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.fullscreen.toggle();

})

    Forms

    forms.applyStyle

    forms.applyStyle (val, formStyles, formMultipleStyles)

    Returns:

    Update input style in a form.

    • val

      Type: String

      Class name to be applied.

    • formStyles

      Type: Object

      Key value pair for class name and description.

    • formMultipleStyles

      Type: Boolean

      Enables the multiple classes to be applied on input.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.forms.applyStyle(, , true);

})

    General

    destroy

    destroy ()

    Returns: Object

    Removes the editable functionality completely. This will return the element back to its pre-init state.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.destroy();

})

    Helpers

    helpers.isMobile helpers.isAndroid helpers.isBlackberry helpers.isIOS helpers.isMac helpers.isTouch helpers.isWindowsPhone helpers.scrollLeft helpers.scrollTop helpers.sanitizeURL

    helpers.isMobile ()

    Returns: Boolean

    Check if the user is using a mobile device.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.isMobile();

})

    helpers.isAndroid ()

    Returns: Boolean

    Check if the user is using a android mobile device.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.isAndroid();

})

    helpers.isBlackberry ()

    Returns: Boolean

    Check if the user is using a blackberry mobile device.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.isBlackberry();

})

    helpers.isIOS ()

    Returns: Boolean

    Check if the user is using a iOS mobile device.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.isIOS();

})

    helpers.isMac ()

    Returns: Boolean

    Check if the user is using a iMac machine.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.isMac();

})

    helpers.isTouch ()

    Returns: Boolean

    Check if the user is using a touch enabled device.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.isTouch();

})

    helpers.isWindowsPhone ()

    Returns: Boolean

    Check if the user is using a windows mobile device.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.isWindowsPhone();

})

    helpers.scrollLeft ()

    Returns: Number

    Gets the current scroll position from left.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.scrollLeft();

})

    helpers.scrollTop ()

    Returns: Number

    Gets the current scroll position from top.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.scrollTop();

})

    helpers.sanitizeURL (url)

    Returns: String

    Sanitize the passed URL to make it safe to use.

    • url

      Type: String

      A URL string.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.helpers.sanitizeURL('https://froala.com');

})

    HTML

    html.cleanEmptyTags html.get html.getSelected html.unwrap html.wrap html.insert html.set

    html.cleanEmptyTags ()

    Returns: Object

    Clean the empty tags inside the editor.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.html.cleanEmptyTags();

})

    html.get ([keep_markers])

    Returns: String

    Returns the HTML inside the editor.

    • keep_markers

      Type: Boolean

      Keep the selection markers. The default value is false.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.html.get(true);

})

    html.getSelected ()

    Returns: String

    Get the selected HTML.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.html.getSelected();

})

    html.unwrap ()

    Returns:

    Unwrap text into paragraphs.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.html.unwrap();

})

    html.wrap ([temp], [tables], [blockquote])

    Returns:

    Wrap text into paragraphs.

    • temp

      Type: Boolean

      Use a div with the class fr-temp to wrap text.

    • tables

      Type: Boolean

      Wrap text inside tables.

    • blockquote

      Type: Boolean

      Wrap text inside quotes.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.html.wrap(false, false, false);

})

    html.insert (html, [clean])

    Returns: Object

    Insert HTML in the WYSIWYG editor at the cursor position or replaces the current selection with the passed HTML.

    • html

      Type: String

      A text containing the HTML to be inserted.

    • clean

      Type: Boolean

      Specifies if the HTML should be cleaned prior to insertion

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.html.insert('foo bar', true);

})

    html.set (html)

    Returns: Object

    Sets the HTML inside the WYSIWYG editor.

    • html

      Type: String

      A text containing the new HTML to be set.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.html.set('<p>My custom paragraph.</p>');

})

    Image

    image.align image.applyStyle image.display image.get image.insert image.remove image.setAlt image.setSize image.upload

    image.align (value)

    Returns: Object

    Align the selected image.

    • value

      Type: String

      The alignment value. Possible values are: left, right, center and justify.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.image.align('left');

})

    image.applyStyle (value)

    Returns: Object

    Style the selected image by adding a class to it.

    • value

      Type: String

      The class to be applied.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.image.applyStyle('rounded');

})

    image.display (value)

    Returns: jQuery object

    Set the display type of the selected image.

    • value

      Type: String

      The display value. Possible values are: block and inline.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.image.display('inline');

})

    image.get ()

    Returns: Object

    Get the current selected image.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.image.get();

})

    Returns: Object

    Inserts an image at the cursor position or replaces existing_image. By default, the inserted image will be aligned center. If there is any selected text, it will be replaced with the inserted image.

    • link

      Type: String

      URL to the image.

    • sanitize

      Type: Boolean

      Sanitize the image link.

    • data

      Type: Hash

      A hash containing the data attributes to be set for the image

    • $existing_image

      Type: jQuery object

      A jQuery object with the image to be replaced.

    • response

      Type: Object

      The response from the server.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.image.insert('/uploads/13451.jpg', true, {'name': 'image_name', 'id': 'image_1'}, $('#my_image'), {link: 'http://example.com/file.pdf'});

})

    image.remove ([$img])

    Returns: Object

    Removes the image from the editor.

    • $img

      Type: jQuery object

      The selected image or a jQuery object with the image to be deleted.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.image.remove($('#my_image'));

})

    image.setAlt (alt)

    Returns: Object

    Set the alternative text of the selected image.

    • alt

      Type: String

      The alternative text value.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.image.setAlt('My Image');

})

    image.setSize (width, height)

    Returns: Object

    Set the width and height of the selected image.

    • width

      Type: String

      The width value.

    • height

      Type: String

      The height value

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.image.setSize('300px', '300px');

})

    image.upload (images)

    Returns: Object

    Upload the passed image to the server.

    • images

      Type: Array

      An array with the images to be uploaded to the server. It is usually the value of a file input.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.image.upload([]);

})

    Image Manager

    imageManager.hide imageManager.show

    imageManager.hide ()

    Returns: Object

    Hides the image manager modal.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.imageManager.hide();

})

    imageManager.show ()

    Returns: Object

    Shows the image manager modal.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.imageManager.show();

})

    Inline Class

    inlineClass.apply

    inlineClass.apply (value)

    Returns: Object

    Apply the passed class name to the current selected text or start typing the in the passed class if no text is selected.

    • value

      Type: String

      The value of the css class to apply.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.inlineClass.apply('fr-highlight');

})

    Inline Style

    inlineStyle.apply

    inlineStyle.apply (value)

    Returns: Object

    Apply the passed style to the current selected text or start typing the in the passed style if no text is selected.

    • value

      Type: String

      The value of the style to apply.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.inlineStyle.apply('Big Red');

})

    Keys

    keys.ctrlKey keys.isArrow keys.isCharacter

    keys.ctrlKey (e)

    Returns: Boolean

    Check if the CTRL key is pressed when the key event was triggered.

    • e

      Type: jQuery Event

      A jQuery event.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.keys.ctrlKey(e);

})

    keys.isArrow (key_code)

    Returns: Boolean

    Check if the passed key code is an arrow key.

    • key_code

      Type: Integer

      Key code.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.keys.isArrow(40);

})

    keys.isCharacter (key_code)

    Returns: Boolean

    Check if the passed key code will produce a character.

    • key_code

      Type: Integer

      Key code.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.keys.isCharacter(40);

})

    Language

    language.translate

    language.translate (str)

    Returns: String

    Translates the passed string using the language file passed to the editor. If no translation is found, the original string is returned.

    • str

      Type: String

      A string to be translated.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.language.translate('Bold');

})

    Line Height

    lineHeight.apply

    lineHeight.apply (val)

    Returns:

    Apply the given line height to selected text.

    • val

      Type: String

      Line height to apply.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.lineHeight.apply(24);

})

    Lists

    lists.format

    lists.format (tag_name)

    Returns: Object

    Format the selected paragraphs as list.

    • tag_name

      Type: String

      The type of the list to format. Possible values are: OL and UL.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.lists.format('OL');

})

    Markdown

    markdown.isEnabled markdown.refresh markdown.toggle

    markdown.isEnabled ()

    Returns: Boolean

    Find if markdown mode is active.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.markdown.isEnabled();

})

    markdown.refresh($btn)

    Returns:

    Set a button to be active if the markdown is enabled or deactivate it otherwise.

    • $btn

      Type: DOM Object

      A button element.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.markdown.refresh();

})

    markdown.toggle ()

    Returns:

    Toggle between the markdown and text view.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.markdown.toggle();

})

    Markers

    markers.insert markers.insertAtPoint markers.place markers.remove markers.split

    markers.insert ()

    Returns: Object

    Insert a marker at the cursor position.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.markers.insert();

})

    markers.insertAtPoint (e)

    Returns:

    Place markers at the mouse position pointed by the jQuery event passed as parameter.

    • e

      Type: jQuery Event

      A jQuery Event that contains mouse position information.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.markers.insertAtPoint(e);

})

    markers.place (range, [marker], [id])

    Returns: Object

    Inserts HTML marker at the beginning or at the end of the range.

    • range

      Type: Range object

      The range where to place markers.

    • marker

      Type: Boolean

      A boolean indicating if the marker has to be set at the beginning or the end of the range.

    • id

      Type: String

      The marker id.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized event.

editor.markers.place(range, true, '1');

})

    markers.remove ()

    Returns: Object

    Clears the selection markers from HTML.

    • This method does not accept any arguments.

    CODE EXAMPLES

    Invoke the method inside the rich text editor:

    var editor = new FroalaEditor('.selector', {}, function () {

// Call the method inside the initialized eve