---
title: "The Comments plugin Demo"
description: "Tiny Comments provides the ability to add comments to the content and collaborate with other users for content editing."
canonical_url: "https://www.tiny.cloud/docs/tinymce/5/comments-demo/"
md_url: "https://www.tiny.cloud/docs/tinymce/5/comments-demo/index.md"
version: "5"
last_updated: "2024-04-09T09:35:32Z"
tokens: 388
---
Important This page documents TinyMCE 5. For new projects, Tiny recommends using the latest, most up-to-date version. [See TinyMCE 8 documentation](../../latest/).
# The Comments plugin Demo

## Interactive example

This example displays how to add the ability to start or join a conversation by adding comments to the content within the TinyMCE editor.

In this example, the features in the Comments plugin are highlighted, including adding a comment, replying to a comment, and deleting a comment.

For information on the other Comments plugin configuration options, see: [The Comments plugin](../comments/).

**Example**

```js
var currentAuthor = 'A Tiny User';
var userAllowedToResolve = 'Admin1';

tinymce.init({
  selector: 'textarea#comments-embedded',
  toolbar: 'bold italic underline | addcomment showcomments',
  menubar: 'file edit view insert format tools tc',
  menu: {
    tc: {
      title: 'Comments',
      items: 'addcomment showcomments deleteallconversations'
    }
  },
  plugins: 'paste code tinycomments',
  tinycomments_mode: 'embedded',
  tinycomments_author: currentAuthor,
  tinycomments_can_resolve: function (req, done, fail) {
    var allowed = req.comments.length > 0 &&
                  req.comments[0].author === currentAuthor;
    done({
      canResolve: allowed || currentAuthor === userAllowedToResolve
    });
  },
  content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }',
  /* The following setup callback opens the comments sidebar when the editor loads */
  setup: function (editor) {
    editor.on('SkinLoaded', function () {
      editor.execCommand("ToggleSidebar", false, "showcomments", { skip_focus: true });
    })
  }
});
```
