Hamburger-categories widget does not mount?

Dev
1

Following the docs here Beginner's guide to developing Discourse Themes
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 discourse/app/assets/javascripts/discourse/app/widgets at main · discourse/discourse · GitHub. 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
image750×181 2.79 KB

2

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

Confirm your site setting is so:

image
image1493×457 81.8 KB

1 Like
3

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

1 Like
4

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

5

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

6

the same as in the docs

<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>
7

theme is here GitHub - tpximpact/bcn-discourse-theme I tried it on https://discourse.theme-creator.io/. and problem remains

8

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.

9

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

1 Like
10

Any errors in the console?

What shows in the inspector?

11

image
image2312×544 124 KB

1 Like
12

I can see categories here, so they do exist…

image
image808×430 21.2 KB

13

My guess is this is the problem:

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

14

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

15

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.

1 Like
16

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”

1 Like
17

Yeah my hunch is that guide is out of date?

18

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?

19

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:

{{mount-widget widget="hamburger-categories" args=(hash categories=this.site.categories)}}
1 Like
20

Great thanks… yes that makes sense and is showing now

As we are here talking about logging in the console
When following the docs Beginner's guide to developing Discourse Themes
When i try

<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

<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

1 Like