> For the complete documentation index, see [llms.txt](https://player.docs.3q.video/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://player.docs.3q.video/plugins/comments.md).

# Comments

Comments are currently available **only for livestreams**.

To enable comments, pass the option `comments: true` in the player setup configuration.\
This will render the comments in the default player layout.

Alternatively, you can pass a **custom HTML element** instead of `true` to embed the comments anywhere on your page.

You may also provide the **ID of a container element**, similar to how the player container itself is defined.

**Example placing comments outside of the videoplayer:**

```html
<div id="player"></div>
<div id="comments"></div>

<script type="text/javascript">
  let comments = document.querySelector('#comments')
  let player = new js3q({
    dataid: '5c3b0910-8850-11e7-9273-002590c750be',
    container: 'player',
    comments: comments,
    comments_username: 'Preset for the username',
    comments_dataid: '16a61ee1-784c-11ea-97a4-002590c750be',
  })
</script>
```

### Additional Options <a href="#page_additional_options" id="page_additional_options"></a>

| Key                         | Type    | Description                                                                                 |
| --------------------------- | ------- | ------------------------------------------------------------------------------------------- |
| comments\_username          | String  | The Preset for the username                                                                 |
| comments\_dataid            | String  | The dataid of another live-stream                                                           |
| comments\_align             | String  | "top" (default) or "bottom" - Alignment for the auto scroll, after the user added a comment |
| comments\_permanentUsername | Boolean | Lock the username, after the first message was sent. (or, if \`comments\_username\` is set) |

### Live Demo <a href="#page_live_demo" id="page_live_demo"></a>

{% embed url="<https://codepen.io/3qgmbh/pen/ZEaGPYG>" %}