---
title: "Anchor plugin"
description: "Insert anchors (sometimes referred to as a bookmarks)."
canonical_url: "https://www.tiny.cloud/docs/tinymce/latest/anchor/"
md_url: "https://www.tiny.cloud/docs/tinymce/latest/anchor/index.md"
version: "latest"
last_updated: "2026-03-09T01:59:33Z"
tokens: 775
---
# Anchor plugin

This plugin adds an anchor/bookmark button to the toolbar that inserts an anchor at the editor’s cursor insertion point. It also adds the menu item `anchor` under the `Insert` menu.

When a user clicks on the anchor button or menu item they will be prompted via a dialog box to enter a string. The string will be inserted into the HTML as an anchor id at the location of the cursor. For example, a user places their cursor at the beginning of "Hello World" and clicks on the anchor button and enters "start" in the dialog box. The resulting HTML will take the form of `<p><a id="start"></a>Hello, World!</p>`.
== Interactive demo

**Example**

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

## Basic setup

```js
tinymce.init({
  selector: "textarea",
  plugins: [
    "anchor", "link", // Link plugin is required for linking to anchors
  ],
  toolbar: "link | anchor",
});
```

> **Note:** For information on bundling this plugin with module bundlers, see [Bundling TinyMCE - Overview](../bundling-guide/).

## Options

### `allow_html_in_named_anchor`

This option allows you to specify whether the editor should parse and keep `html` within named `anchor` tags.

**Type:** `Boolean`

**Default value:** `false`

**Possible values:** `true`, `false`

#### Example: using `allow_html_in_named_anchor`

```js
tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  allow_html_in_named_anchor: true
});
```

## Toolbar buttons

The Anchor plugin provides the following toolbar buttons:

| Toolbar button identifier | Description |
| --- | --- |
| `anchor` | Creates/Edits anchor elements. |

These toolbar buttons can be added to the editor using:

- The [`toolbar`](../toolbar-configuration-options/#toolbar) configuration option.
- The [`quickbars_insert_toolbar`](../quickbars/#quickbars_insert_toolbar) configuration option.
- [Custom Context toolbars](../contexttoolbar/).

## Menu items

The Anchor plugin provides the following menu items:

| Menu item identifier | [Default Menu Location](../menus-configuration-options/#example-the-tinymce-default-menu-items) | Description |
| --- | --- | --- |
| `anchor` | Insert | Inserts an anchor into the editor. |

These menu items can be added to the editor using:

- The [`menu`](../menus-configuration-options/#menu) configuration option.
- The [`contextmenu`](../menus-configuration-options/#contextmenu) configuration option.
- [Custom Menu toolbar buttons](../custom-menu-toolbar-button/).

## Commands

The Anchor plugin provides the following TinyMCE command.

| Command | Description |
| --- | --- |
| mceAnchor | Opens the insert/edit anchor dialog. |

Example
```js
tinymce.activeEditor.execCommand('mceAnchor');
```