# Shortcode with custom key value to range

**URL:** <https://discourse.gohugo.io/t/shortcode-with-custom-key-value-to-range/43283>\
**Category:** support\
**Created:** [March 4, 2023, 6:08pm UTC](https://discourse.gohugo.io/t/shortcode-with-custom-key-value-to-range/43283 "2023-03-04T18:08:32Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Milky](https://avatars.discourse-cdn.com/v4/letter/m/f19dbf/32.png) [@Milky](https://discourse.gohugo.io/u/Milky)\
**Post date:** [March 4, 2023, 6:08pm UTC](https://discourse.gohugo.io/t/shortcode-with-custom-key-value-to-range/43283/1 "2023-03-04T18:08:32Z")

</div>

Hi everyone,  
i’m new to Hugo and i’m testing it on a personal project i’m working on.

What i’d like to achieve is to use a shortcode to range through the results of my dataset in my page templates and i want it to be flexible by passing the name of the key value as argument so i can retrieve the data i need.

The problem i’m facing though is that the custom value is passed as string and throws me an error.  
I’ve tried to use the slice and index functions for trying to map the collection the way i want but i can’t make this work.

Is it possible to do the thing i’m trying to achieve or should i hard code the range function in every page?

Thanks in advance to everyone who will take some time for helping me!

Some example code:  
`layouts/shordcodes/steps.html`

```auto
{{$collection := .Site.Data.steps}}
{{$customKeyValue := .Get 0}} // Might be item-a or item-b according to the example

{{range $collection}}

  {{range $customKeyValue}}
  {{.title}}
  {{.description}}
  {{end}}

{{end}}

```

`data/steps.json`

```auto
{
  "steps": {
    "item-a": 
    [
      {
      "title":"step1",
      "description": "Some text"
      },
      {
        "title":"step2",
        "description": "Some text"
      },
    ],

    "item-b": [
      {
        "title":"step 1",
        "description": "Some text"
        },
        {
          "title": "step 2",
          "description": "Some text"
        },
    ],
}
}

```

---

<div class="post-metadata">

**Author:** ![jmooring](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jmooring/32/4214_2.png) [@jmooring](https://discourse.gohugo.io/u/jmooring)\
**Post date:** [March 4, 2023, 6:12pm UTC](https://discourse.gohugo.io/t/shortcode-with-custom-key-value-to-range/43283/2 "2023-03-04T18:12:07Z")

</div>

You need to use the `index` function within the shortcode to get the data, then you can work with it.

---

<div class="post-metadata">

**Author:** ![Milky](https://avatars.discourse-cdn.com/v4/letter/m/f19dbf/32.png) [@Milky](https://discourse.gohugo.io/u/Milky)\
**Post date:** [March 4, 2023, 6:48pm UTC](https://discourse.gohugo.io/t/shortcode-with-custom-key-value-to-range/43283/3 "2023-03-04T18:48:28Z")

</div>

I have already tried the index function as the example below. It doesn’t throws errors but even data.  
If i debug the `$customKeyValue` with printf it returns `nil.`

`
Is it a syntax error somewhere?
```auto
{{$collection := .Site.Data.steps}}
{{$key:= .Get 0}} 
{{$customKeyValue:= index $collection $key}}

{{range $collection}}

  {{range $customKeyValue}}
  {{.title}}
  {{.description}}
  {{end}}

{{end}}

```
EDIT
I forgot to put the shortcode call
I’m passing the value like that
```auto
{{< steps `item-a` >}}

````

---

<div class="post-metadata">

**Author:** ![jmooring](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jmooring/32/4214_2.png) [@jmooring](https://discourse.gohugo.io/u/jmooring)\
**Post date:** [March 4, 2023, 6:56pm UTC](https://discourse.gohugo.io/t/shortcode-with-custom-key-value-to-range/43283/4 "2023-03-04T18:56:21Z")

</div>

Your data structure has an “outer” `steps` key (the file name) and an “inner” `steps` key (inside the data file).

```auto
{{< steps "item-a" >}}

```

```auto
{{ range index site.Data.steps "steps" (.Get 0) }}
  {{.title}}
  {{.description}}
{{ end }}

```

or

```auto
{{ range index site.Data.steps.steps (.Get 0) }}
  {{.title}}
  {{.description}}
{{ end }}

```

---

<div class="post-metadata">

**Author:** ![Milky](https://avatars.discourse-cdn.com/v4/letter/m/f19dbf/32.png) [@Milky](https://discourse.gohugo.io/u/Milky)\
**Post date:** [March 4, 2023, 7:16pm UTC](https://discourse.gohugo.io/t/shortcode-with-custom-key-value-to-range/43283/5 "2023-03-04T19:16:07Z")

</div>

Ah! These names tricked me so hard and got me on the wrong way. 😅

Thank you for the correction @jmooring

---

<div class="post-metadata">

**Author:** ![system](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/system/32/1_2.png) [@system](https://discourse.gohugo.io/u/system)\
**Post date:** [March 6, 2023, 7:16pm UTC](https://discourse.gohugo.io/t/shortcode-with-custom-key-value-to-range/43283/6 "2023-03-06T19:16:34Z")

</div>

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.