TinyMCE

The TinyMCE extension uses (Tiny Moxiecode Content Editor) is a platform-independent, browser-based WYSIWYG editor control, written in JavaScript and released as open-source software under the LGPL by Ephox.

wisej-extensions/Wisej.Web.Ext.TinyMCE at 3.5 · iceteagroup/wisej-extensionsGitHub

TinyMCE Source Code

Code Example

TinyMCE editor1 = new TinyMCE()
{
    Dock = DockStyle.Fill,
    Text = "<p>Hello <strong>world</strong></p>",

    ShowMenuBar = false,
    ShowToolbar = true,
    ShowFooter = true,

    Options = new
    {
        plugins = "link image code lists paste hr",
        toolbar = "undo redo | bold italic | bullist numlist | link | code"
    }
};

this.Controls.Add(editor1);

Let's break down what this code example does. It creates a new TinyMCE object (editor1). That object has several properties set inside of Curly braces {}. First, the Dock is set to DockStyle.Fill. This means that it will fill the container it is in (such as a Form or Page). Next the text is created. This is the text that will be displayed inside of the TinyMCE control. Note the HTML tags - <p> and <strong> so it will be a bolded paragraph. Next, we set ShowMenuBar ShowToolBar and ShowFooter, so that the toolbar and footer are shown. Finally, we set the Options. Inside of Options, we set the plugins that are used and the items that will show on the toolbar.

The TinyMCE editor created by this code will look like this:

How to Use

The TinyMCE extension can be added to a Wisej.NET project using NuGet Package Manager.

Wisej-3-TinyMCE 3.5.33nuget

Set the Text including HTML formatting.

Use ShowMenuBar, ShowToolbar, ShowFooter, Options and FontNames to customize the TinyeMCE. for more features you can add ExternalPlugins.

You can find a Wisej sample of TinyEditor, TinyMCE and CKEditor and more useful information in our Blog.