# Data-driven menus?

**URL:** <https://discourse.gohugo.io/t/data-driven-menus/12119>\
**Category:** support\
**Created:** [May 23, 2018, 8:27pm UTC](https://discourse.gohugo.io/t/data-driven-menus/12119 "2018-05-23T20:27:09Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mihai](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/mihai/32/6046_2.png) [@Mihai](https://discourse.gohugo.io/u/Mihai)\
**Post date:** [May 23, 2018, 8:27pm UTC](https://discourse.gohugo.io/t/data-driven-menus/12119/1 "2018-05-23T20:27:09Z")

</div>

Hello, I’m trying to put Hugo as frontend “on top” of a Drupal install (a.k.a “Headless CMS”).  
I can retrieve the content of main-menu using

```auto
{{ $main_menu := getJSON "<path_to_endpoint>/menu/main-menu.json" }}

```

What I get is a json that looks like this:

```auto
{  
 name: "main-menu",
 tree: {
       FirstKey: {
                 link: {
                       title: "FirstTitle",
                       path: "collection/9",
                       weight: "0",
                       depth: "1",
                       has_children: "0",
                       ... other stuff ...
                 },
                 children: []
       },
       SecondKey: {
                  link: {
                        title: "SecondTitle",
                        path: "collection/11",
                        weight: "1",
                        depth: "1",
                        has_children: "1",
                        ... other stuff ...
                  },
                  children: {
                     SecondSubKey: {
                                   link: {
                                         title: "Subtitle",
                                         path: "collection/73",
                                         weight: "0",
                                         depth: "2",
                                         ... other stuff ...
                                   },
                                   children: []
                    }
                  }
       },
       ... other menu items ...
}

```

What I did (and it works):  
Using a partial, I create the menu (haven’t implemented weight and children yet) like so:

```auto
<div class="navbar-collapse collapse" id="navigation">
                <ul class="nav navbar-nav navbar-right">
                {{ $main_menu := getJSON "<path_to_endpoint>/menu/main-menu.json" }}
                {{ $menupath := "a" }}
                {{- $menuitemname := "b" -}}
                {{- $menuitemweight := "0" -}}
                  {{ range $main_menu.tree }}
                    {{- $main_menu_item := . -}}
                    {{- range $key, $value := $main_menu_item.link -}}
                    {{- if eq $key "title" -}} {{- $.Scratch.Set $menuitemname . -}} {{- end -}}
                    {{- if eq $key "path" -}} {{- $.Scratch.Set $menupath . -}} {{- end -}}
                    {{- if eq $key "weight" -}} {{- $.Scratch.Set $menuitemweight . -}} {{- end -}}
                  {{- end -}}
                  <li class="dropdown">
                    <a href="{{$.Scratch.Get $menupath}}">{{$.Scratch.Get $menuitemname}}</a>
                  </li>
                  {{ end }}
                </ul>
            </div>

```

However, it would be far nicer to add the data retrieved via getJson to a variable.  
Then add the whole structure to .Site.menus.main  
And create the menu only afterwards …  
Is this possible? I tried, using Scratch, no luck so far …

---

<div class="post-metadata">

**Author:** ![kaushalmodi](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/kaushalmodi/32/2567_2.png) [@kaushalmodi](https://discourse.gohugo.io/u/kaushalmodi)\
**Post date:** [May 23, 2018, 8:30pm UTC](https://discourse.gohugo.io/t/data-driven-menus/12119/2 "2018-05-23T20:30:45Z")

</div>

> [@Mihai](#):
>
> }```

You need to fix the Markdown syntax to show your post correctly in the forum…

It is:

````auto
```
code
more code
```

````

Not:

````auto
```code
more code```

````

---

<div class="post-metadata">

**Author:** ![alexandros](https://avatars.discourse-cdn.com/v4/letter/a/ecc23a/32.png) [@alexandros](https://discourse.gohugo.io/u/alexandros)\
**Post date:** [May 23, 2018, 8:36pm UTC](https://discourse.gohugo.io/t/data-driven-menus/12119/3 "2018-05-23T20:36:58Z")

</div>

> [@Mihai](#):
>
> However, it would be far nicer to add the data retrieved via getJson to a variable.  
> Then add the whole structure to .Site.menus.main  
> And create the menu only afterwards …  
> Is this possible? I tried, using Scratch, no luck so far …

It doesn’t seem possible. But basically you are trying to hack Hugo here in a big way.

We cannot help. Your question is out of the scope of the Support Forum.

---

<div class="post-metadata">

**Author:** ![Mihai](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/mihai/32/6046_2.png) [@Mihai](https://discourse.gohugo.io/u/Mihai)\
**Post date:** [May 23, 2018, 9:07pm UTC](https://discourse.gohugo.io/t/data-driven-menus/12119/4 "2018-05-23T21:07:42Z")

</div>

Sorry and thanks!  
Old (a.k.a. Trello) habits die hard … 🙂

---

<div class="post-metadata">

**Author:** ![Mihai](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/mihai/32/6046_2.png) [@Mihai](https://discourse.gohugo.io/u/Mihai)\
**Post date:** [May 23, 2018, 9:11pm UTC](https://discourse.gohugo.io/t/data-driven-menus/12119/5 "2018-05-23T21:11:00Z")

</div>

Thanks.  
I was only considering this because Hugo is, IMHO, probably one of the best “heads” to put on top of a “headless” CMS.  
I’ll just stick to what I was able to produce so far as working code.