# Custom theme component doesn't show on first render

**URL:** https://meta.discourse.org/t/custom-theme-component-doesnt-show-on-first-render/232162
**Category:** Support
**Created:** [July 7, 2022, 12:55am UTC](https://meta.discourse.org/t/custom-theme-component-doesnt-show-on-first-render/232162 "2022-07-07T00:55:57Z")
**Posts on this page:** 2
**Page:** 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: [July 7, 2022, 12:55am UTC](https://meta.discourse.org/t/custom-theme-component-doesnt-show-on-first-render/232162/1 "2022-07-07T00:55:57Z")

</div>

I created a simple component that will display a simple clickable banner for the login users. It works fine until I upgrade to [2.9.0.beta5: Security Fixes, Block Hotlinked Media, PM Tagging, Search Improvements, and more](https://meta.discourse.org/t/2-9-0-beta5-security-fixes-block-hotlinked-media-pm-tagging-search-improvements-and-more/229845)

The component only shows up when I refresh the page 2~3 times and it will disappear every time when I open my site in a new tab/window. I see the same issue happens on theme-creator.

Any idea why this happens? Following is the code I use.

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

let user = api.getCurrentUser();

if(user){
 api.createWidget("fixed-banner", {
     tagName: "div.container-row",

     html() {
         return h('div.content', [
             h('a.bannerLink', {
                href: '/categories',
             }, 'test'),
    ]);
     }
 });
  
}
</script>

```

---

<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: [July 13, 2022, 1:30am UTC](https://meta.discourse.org/t/custom-theme-component-doesnt-show-on-first-render/232162/2 "2022-07-13T01:30:03Z")

</div>

Find why, I used to put

```plaintext
<script type="text/x-handlebars" data-template-name="/connectors/above-site-header/theme-component">
    {{mount-widget widget="theme-component"}}
</script>

```

in `<body>` tag, moving to head tag fixed this issue. But it’s weird that the issue suddenly happen after recent upgrade, it used to work fine.
