SNIPPET: TINYMCE – WYSIWYG EDITOR IMPLEMENTATION

TinyMCE Integration For UBotOn UBot forum I’ve noticed that no one knows (or want to share info on) how to implement WYSIWYG (what you see if what you get) editor, that’s why I’ve decided to publish a snippet I was using for a while now. In case you don’t know what WYSIWYG editor is, it’s an advanced text editor that will allow you/your users to format text without needing to write HTML code. In this snippet we are using a popular and widely used TinyMCE.

COMMANDS

TINYMCE CONTENT SET

This is the only command of this snippet and it allows you to update content of TinyMCE editor by passing the HTML as an parameter. You’ll notice that we first clear the variable “#TINYMCE Content Set”, and that’s to ensure that the variable will change it’s value and in row trigger a JavaScript onchange script, which finally updates the editor.

 

SNIPPET AND TEST CODE:

 

HOW TO USE

SET TINYMCE CONTENT

To set the editors content you just need to execute “TINYMCE CONTENT SET” command and pass in the HTML you want to display in the editor (the command simply sets variable “#TINYMCE Content Set” which then updates the editor via JavaScript).

GET TINYMCE CONTENT

The content of editor is always accessible via variable with name “#TINYMCE Content” so you just need to access that variable to get the content (to change this UBot variable name you need to modify JavaScript variable with name “variableName”).

 

DEPENDENCIES

TinyMCE Editor

 

UBOT FORUM DISCUSSION

Can I Add Wysiwyg Editor In Ui Block Text?

 

If you like this snippet or have any questions or suggestions, please feel free to leave a comment or subscribe to the RSS feed to have future snippets delivered to your feed reader.

4 thoughts on “SNIPPET: TINYMCE – WYSIWYG EDITOR IMPLEMENTATION

    1. Tadej UBotDev Post author

      I’ve updated the code above as well as on the forum (new buttons added and some bugs that were introduced with that change fixed).

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

*