# Plugin outlet question

**URL:** <https://meta.discourse.org/t/plugin-outlet-question/268507>\
**Category:** Development\
**Created:** [June 15, 2023, 6:21pm UTC](https://meta.discourse.org/t/plugin-outlet-question/268507 "2023-06-15T18:21:08Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![th21](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/th21/32/211915_2.png) [@th21](https://meta.discourse.org/u/th21)\
**Post date:** [June 15, 2023, 6:21pm UTC](https://meta.discourse.org/t/plugin-outlet-question/268507/1 "2023-06-15T18:21:08Z")

</div>

I wrote a theme component to add a banner to my site (above site header), it works, but when the chat panel shows up, 1) on the desktop, the chat header will be covered by the site header, 2) on the mobile, the chat input box will be pushed out of the screen (below the viewport).

 ![image](https://global.discourse-cdn.com/meta/original/4X/4/4/d/44de50e594d484b87e631c73adb8ca3a96b1c38a.png)

Anyway to fix this issue? I assumed the plugin was not initialized correctly so the chat drawer can’t detect it, but don’t know the solution.

Thanks in advance.

```plaintext
<script type="text/discourse-plugin" version="0.8">
const h = require("virtual-dom").h;

let user = api.getCurrentUser();

api.createWidget("general-banner", {
    tagName: "div",
    html() {
        if ( !user || (user && !user.custom_fields.user_field_2 )) {
            return [
            //content
            ];
        }
    }
});

</script>

<script type="text/x-handlebars" data-template-name="/connectors/above-site-header/general-banner">
 {{mount-widget widget="general-banner"}}
 
</script>
  

```

---

_[View the full topic](https://meta.discourse.org/t/plugin-outlet-question/268507)._