# TinyMCE

The [TinyMCE ](https://www.tiny.cloud)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.

![](/files/-MjKxMXBce-ZYJrf4kwg)

{% embed url="<https://github.com/iceteagroup/wisej-extensions/tree/master/Wisej.Web.Ext.TinyMCE>" %}
TinyMCE Source Code
{% endembed %}

## Code Example

```csharp
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:

<figure><img src="/files/77PBHpY9CoGVU1kz2SMf" alt=""><figcaption></figcaption></figure>

## How to Use

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

{% embed url="<https://www.nuget.org/packages/Wisej-3-TinyMCE>" %}

Set the *Text* including HTML formatting.

Use [*ShowMenuBar*](https://github.com/iceteagroup/wisej-docs-extensions/blob/master/extensions/tinymce/broken-reference/README.md), [*ShowToolbar*](https://github.com/iceteagroup/wisej-docs-extensions/blob/master/extensions/tinymce/broken-reference/README.md), [*ShowFooter*](/extensions/extensions/tinyeditor/api/wisej.web.ext.tinyeditor.tinyeditor.md#showfooter), [*Options* ](https://github.com/iceteagroup/wisej-docs-extensions/blob/master/extensions/tinymce/broken-reference/README.md)and [*FontNames* ](https://github.com/iceteagroup/wisej-docs-extensions/blob/master/extensions/tinymce/broken-reference/README.md)to customize the [TinyeMCE](https://github.com/iceteagroup/wisej-docs-extensions/blob/master/extensions/tinymce/broken-reference/README.md).\
for more features you can add [*ExternalPlugins*](https://github.com/iceteagroup/wisej-docs-extensions/blob/master/extensions/tinymce/broken-reference/README.md).

{% hint style="info" %}
You can find a Wisej sample of TinyEditor, **TinyMCE** and CKEditor and more useful information in our [Blog](https://wisej.com/blog/editors-choice/).
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.wisej.com/extensions/extensions/tinymce.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.