# Como personalizar o CSS do ChatMessageInfo / autor do chat (não há widget?)

**URL:** <https://meta.discourse.org/t/how-to-customize-chatmessageinfo-chat-author-css-there-is-no-widget/335336>\
**Category:** Development\
**Created:** [Novembro 9, 2024, 12:21pm UTC](https://meta.discourse.org/t/how-to-customize-chatmessageinfo-chat-author-css-there-is-no-widget/335336 "2024-11-09T12:21:18Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)\
**Post date:** [Dezembro 4, 2024, 1:01am UTC](https://meta.discourse.org/t/how-to-customize-chatmessageinfo-chat-author-css-there-is-no-widget/335336/2 "2024-12-04T01:01:17Z")

</div>

Olá,

Acho que não será fácil. Não há um `PluginOutlet` disponível nesta área (não hesite em solicitá-lo!)

Se você quiser adicionar apenas `classnames`, você deve conseguir fazer desta forma:

```js
api.modifyClass(
  "component:chat/message/info",
  (Superclass) =>
    class extends Superclass {
      get usernameClasses() {
        let classes = super.usernameClasses;

        // Adiciona classes extras
        classes += " developer";

        return classes;
      }
    }
);

```

Isso sobrescreve este código:

> <https://github.com/discourse/discourse/blob/main/plugins/chat/assets/javascripts/discourse/components/chat/message/info.gjs#L32-L55>

---

_[View the full topic](https://meta.discourse.org/t/how-to-customize-chatmessageinfo-chat-author-css-there-is-no-widget/335336)._
