Help with accessing JSON data in template

This is kind of beginner question, but I am importing a JSON file and am having trouble rendering the inner items in from the JSON file into my template. This is what I cant seem to figure out:
Beginning w/ a contrived JSON fragment (this is very similar to the output of images from my CDN)

{
  "sketch": [
    {
     "url": "https://example.com/mysketch.png"
     "other": "anotherthing",
     "display_name": "the name is bobo",
     "alt": "the alt text",
    },
    {
     "url": "https://example.com/mydifferentSketch.webp"
     "other": "anotherthing",
     "display_name": "the name is babosso",
     "alt": "the alt text",
    },    
   ]
  }

And here is a simplified version of my hugo template:


...
<main>
      <ul>
        {{ range $.Site.Data.artworks }}
	        {{ range .sketch }}
	       <li>
		  <img src="{{ .url }}" alt="{{ .alt }}" />
	       </li>
	      {{ end }}
        {{ end }}
      </ul>
</main>

I know its something along these lines, but I always get flummoxed by golang mapping. Any and all guidance is appreciated…
Thanks!

with your example JSON the toplevel element is a Hash not an Array. The array is the element with the key sketch

so you want to iterate over the sketch element:

   <ul>
      {{ with $.Site.Data.artworks }}
         {{ range .sketch }}
            <li><img src="{{ .url }}" alt="{{ .alt }}" /></li>
         {{ end }}
      {{ end }}
   </ul>
1 Like

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