---
title: "Markdown plugin"
description: "The Markdown Premium plugin detects pure markdown from a paste event within a TinyMCE editor instance."
canonical_url: "https://www.tiny.cloud/docs/tinymce/latest/markdown/"
md_url: "https://www.tiny.cloud/docs/tinymce/7/markdown/index.md"
version: "7"
last_updated: "2024-03-15T04:45:19Z"
tokens: 1125
---
Important This page documents TinyMCE 7. For new projects, Tiny recommends using the latest, most up-to-date version. [See TinyMCE 8 documentation](../../latest/markdown/).
# Markdown plugin

> **Note:** This plugin is only available for [paid TinyMCE subscriptions](/pricing/).

> **Note:** This feature is only available for TinyMCE 7.0 and later.
The Markdown Premium plugin detects pure markdown from a paste event within a TinyMCE editor instance.

## Using the Markdown plugin

### How it works

The **Markdown** Premium Plugin allows the editor to detect if pure markdown is pasted into the TinyMCE editor instance.

During this paste event, If the editor detects markdown has been pasted it will:

- attempt to convert the markdown to HTML, while
- add a undo level before the conversion to allow for undo of plain-text.

> **Tip:** Below is a list of handy shortcuts for pasting in `plain-text` format when using the Markdown plugin within TinyMCE.
> 
> To paste text in plain form using keyboard shortcuts, use:
> 
> - **Windows**: `Ctrl+Shift+V`.
> - **Mac**: `Cmd+Shift+V`.
> These shortcuts allow pasting of `plain-text` without formatting, particularly when copying markdown syntax (text) from websites or documents. If the user copied text from one source with certain formatting (such as bold, italics, or different fonts), using this command will paste the text into the new location without carrying over the original formatting.

## Basic setup

To setup the Markdown plugin user-interface in the editor:

- add `markdown` to the `plugins` option in the editor configuration;

For example:

```js
tinymce.init({
  selector: 'textarea',  // change this value according to your html
  plugins: 'markdown',
});
```

## Interactive examples

**Example**

```js
tinymce.init({
  selector: 'textarea.markdown',
  plugins: [
    "markdown", "advlist", "anchor", "autolink", "charmap", "code", "fullscreen",
    "help", "image", "insertdatetime", "link", "lists", "media",
    "preview", "searchreplace", "table", "visualblocks",
  ],
  toolbar: "undo redo | styles | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
  height: 600,
  content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }'
});
```

## Options

The following configuration options affect the behavior of the Markdown plugin.

## `markdown_symbols` option

The `markdown_symbols` option allows you to define `key/value` pairs where the `key` represents a symbol in your content and the `value` represents the replacement for that symbol.

**Type:** `Object`

**Default value:** The `markdown_symbols` object accepts the following key-value pairs by default currently:

```js
{
  C: '©',
  TM: '™',
  R: '®'
}
```

### Example: using `markdown_symbols`

```js
tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  plugins: 'markdown',
  markdown_symbols: {
    C: '©',
    TM: '™',
    R: '®'
  }
});
```

> **Note:** Additionally, if the **Emoticons** plugin is enabled and properly set up, emojis surrounded by colons (:) will also be replaced. This feature allows for a broader range of replacements, including emojis represented by image files. For example, `:smile:` will be translated to the corresponding emoji, if configured.

> **Note:** In Markdown content, it’s important to enclose key symbols like `"C"` within parentheses, as in `"(C)"`, to ensure proper conversion; note that they are **case-sensitive**, so `"(c)"` *will not be transformed*.

## Commands

The Markdown plugin provides the following TinyMCE commands.

| Command | Description |
| --- | --- |
| MarkdownInsert | Insert new markdown content into the editor as HTML |

Examples
```js
tinymce.activeEditor.execCommand('MarkdownInsert', false, 'paragraph');
tinymce.activeEditor.execCommand('MarkdownInsert', false, '**bold**');
tinymce.activeEditor.execCommand('MarkdownInsert', false, '# Header');
```

## APIs

The Markdown plugin provides the following APIs.

A new API, `editor.plugins.markdown.getContent();` has been added to support the new Markdown plugin

The API’s function is to take a TinyMCE document, and processes it such that the previously HTML content is converted into content with valid Markdown syntax.

The `editor.plugins.markdown.getContent();` API does not require configuration from the user

```ts
interface PluginAPI {
  getContent: () => Promise<string>
}
```

## Example

TinyMCE document content:

```html
<h3>Heading</h3>
<p>This is a paragraph.</p>
<ul>
  <li>Item 1</li>
  <li>Item 2</li>
</ul>
```
API output:

```js
### Heading

This is a paragraph.

* Item 1
* Item 2
```