# Hamburger-categories widget does not mount?

**URL:** https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683
**Category:** Development
**Created:** [February 20, 2023, 1:59pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683 "2023-02-20T13:59:35Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 1:59pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/1 "2023-02-20T13:59:35Z")

</div>

Following the docs here [Developing Discourse Themes & Theme Components](https://meta.discourse.org/t/beginners-guide-to-developing-discourse-themes/93648#mounting-widgets-24)  
The example using the log works fine but when I update the widget to  
`{{mount-widget widget="hamburger-categories"}}`  
Nothing comes out… I’ve run through the list at [https://github.com/discourse/discourse/tree/main/app/assets/javascripts/discourse/app/widgets](https://github.com/discourse/discourse/tree/main/app/assets/javascripts/discourse/app/widgets). and some widgets show some don’t?

Eventually i want to use just the categories list as buttons inside a custom header, like this…

 ![image](https://global.discourse-cdn.com/meta/original/4X/5/4/f/54f73d8920c09884fa91ef6863c3f2d9fce0eafd.png)

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [February 20, 2023, 2:13pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/2 "2023-02-20T14:13:52Z")

</div>

Have you got the new sidebar activated? That will hide the old hamburger menu.

Confirm your site setting is so:

 ![image](https://global.discourse-cdn.com/meta/original/4X/e/9/d/e9dd735303e29b6d7f690fe3b7b6f9cce712c84f.jpeg)

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 2:23pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/3 "2023-02-20T14:23:32Z")

</div>

I had it set to “Header Dropdown” I changed it to “Legacy” but same issue

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 2:27pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/4 "2023-02-20T14:27:56Z")

</div>

The hamburger menu shows, but I am after just the categories  
` {{mount-widget widget="hamburger-menu"}}`

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [February 20, 2023, 2:27pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/5 "2023-02-20T14:27:57Z")

</div>

Apologies I was thrown by the widget name. What plugin outlet are you using?

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 2:28pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/6 "2023-02-20T14:28:50Z")

</div>

the same as in the docs

```plaintext
<script type="text/x-handlebars" data-template-name="/connectors/below-footer/fancy-footer">
  <div class="footer">
    <div class="wrap">
      <p>before mounting a widget</p>
        {{mount-widget widget="home-logo"}}
        {{mount-widget widget="hamburger-categories"}}
      <p>after mounting a widget</p>
    </div>
  </div>
  </script>

```

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 2:40pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/7 "2023-02-20T14:40:06Z")

</div>

theme is here [GitHub - Manifesto-Digital/bcn-discourse-theme · GitHub](https://github.com/tpximpact/bcn-discourse-theme) I tried it on [https://discourse.theme-creator.io/](https://discourse.theme-creator.io/). and problem remains

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [February 20, 2023, 3:01pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/8 "2023-02-20T15:01:38Z")

</div>

If you look at the guide you can see the plugin outlet takes an attribute `showFooter`. That’s probably false. Meaning that neither the footer nor the attached widget will show.

In any case why a footer outlet for a header artefact?

Use the plugin outlets theme component to pick a better location imho.

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 3:11pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/9 "2023-02-20T15:11:20Z")

</div>

It does show… it shows widget=“home-logo”  
and it also shows widget=“hamburger-menu”

but it doesn’t show widget=“hamburger-categories”

Just testing it out, doesn’t really matter where it is right now

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [February 20, 2023, 3:13pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/10 "2023-02-20T15:13:48Z")

</div>

Any errors in the console?

What shows in the inspector?

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 3:17pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/11 "2023-02-20T15:17:17Z")

</div>

![image](https://global.discourse-cdn.com/meta/original/4X/0/e/3/0e3b5049aa9aff11824fcfd510a97d02c662be33.png)

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 3:18pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/12 "2023-02-20T15:18:11Z")

</div>

I can see categories here, so they do exist..

 ![image](https://global.discourse-cdn.com/meta/original/4X/9/f/6/9f64ebaa1d9a76bbe6f068568ac0779984206b08.png)

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [February 20, 2023, 3:19pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/13 "2023-02-20T15:19:49Z")

</div>

My guess is this is the problem:

> <https://github.com/discourse/discourse/blob/437de6338efd2bae22ef00febaa3d992ee5ed790/app/assets/javascripts/discourse/app/widgets/hamburger-menu.js#L239>

There’s no attribute categories being passed via the footer outlet

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 3:26pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/14 "2023-02-20T15:26:39Z")

</div>

but when i use widget=“hamburger-menu” in the footer outlet it shows the categories  
I’ve tried other outlets around the page and problem persists

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [February 20, 2023, 3:30pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/15 "2023-02-20T15:30:15Z")

</div>

Had you posted that error message initially it would have saved a lot of time.

Always look at the console.

You may need to attach this one with JavaScript once you have retrieved the list of Categories in the same way the Hamburger menu does it.

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 4:07pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/16 "2023-02-20T16:07:13Z")

</div>

yeah definitely and even more time if the documentation didn’t say “Now, mounting a widget is pretty simple, all you need to know is the widget’s name. That’s it”

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [February 20, 2023, 4:09pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/17 "2023-02-20T16:09:15Z")

</div>

Yeah my hunch is that guide is out of date?

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 4:11pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/18 "2023-02-20T16:11:58Z")

</div>

Do you know where I can find the most up to date guide, I’m flying around in here trying to find answers but landing on posts that are 4 years old. Is there an actual guide document somewhere?

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [February 20, 2023, 4:21pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/19 "2023-02-20T16:21:22Z")

</div>

> [@Andrew\_Dickens](#):
>
> “Now, mounting a widget is pretty simple, all you need to know is the widget’s name. That’s it”

Yeah I can see how that would be misleading… technically it does mount the widget, but that doesn’t mean the data required by the widget is automatically available.

You can try passing the categories into the widget this way:

```handlebars
{{mount-widget widget="hamburger-categories" args=(hash categories=this.site.categories)}}

```

---

<div class="post-metadata">

### Author: ![Andrew\_Dickens](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrew_dickens/32/290897_2.png) [@Andrew\_Dickens](https://meta.discourse.org/u/Andrew_Dickens)
#### Post date: [February 20, 2023, 4:53pm UTC](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683/20 "2023-02-20T16:53:29Z")

</div>

Great thanks.. yes that makes sense and is showing now

As we are here talking about logging in the console  
When following the docs [Developing Discourse Themes & Theme Components](https://meta.discourse.org/t/beginners-guide-to-developing-discourse-themes/93648#consolelog-is-your-friend-26)  
When i try

```plaintext
<script type="text/discourse-plugin" version="0.8">
    console.log(Discourse)
</script>

```

I’m not sure I get a “global object to the console”, I get a class

And if i try something like

```plaintext
<script type="text/discourse-plugin" version="0.8">
  const settings = Discourse.SiteSettings;
 console.log(settings)
</script>

```

I get this error  
`THEME 6 'BCN Theme - watched locally'] Deprecation notice: use injected siteSettings instead of Discourse.SiteSettings`

[Next page](https://meta.discourse.org/t/hamburger-categories-widget-does-not-mount/255683.md?page=2)
