【SOLVED】Pair Content with Data File, shortcode embedded in Zero content

support
1

Newbie here and learning Hugo by reading Docs and surfing this forum.

I am trying to build a site(locally) and want to get some advices from your talents :-).

  1. Background: I have about several-hundred potential contacts(/customers) and their basic information originated from different resources, i.e. John@github, Phil@twitter, myname@source, etc… The file format is JSON (most part of those converted from CSV).

  2. Goal: Building list page and single page for all contacts(/customers). Categorized and Tags added to each person(/org). Once get new, I would like to create a name@source.md paired with name@source.JSON data file so that I could insert more data into it in a flexible way.

    • Content/data organization:(hugo version: 0.37)
      1.1 content/customer/… ==> add myname@source.md under the folder.
      1.2 archetype/customer.md ==> front-matter params include “title/date/categories/tags/data_source”.
      1.3 data/customer/… ==> import each customer’s myname@soure.JSON
      1.4 theme/WIP/layouts
      • _default (with list.html and single.html)
      • customer/list.html (and single.html)
      • partials (with head/header/footer/nav)
      • shortcodes (if any)
      • index.html
      • 404.html
    • _internal/pagination.html template used for paginator

  4. Some settings/code snippets:
    Front-Matter for content

 title: "name@source"
 date: 2018-03-10 ......
 cateories: [ ] # manually added the value
 tags: [ ] # manually added the value
 data_source: "name@source.JSON"
 ......
 ---
 {{% datacard %}}

for layout/shortcodes/datacard.html

 {{  $data := index $Page.Params.data_source }}
 {{ range $data }}
 <div>
 {{ if .bio }}
 <p>{{ .bio }}</p>
 </div>
 {{ end }}

for customer/list.html

{{ partial "head.html" . }}
    ...

{{ $paginator := .Paginate (where .Data.Pages "Type" "customer") }}
{{ range $paginator.Pages }}

<section class="customer-list">
{{ .Content }}
</section>
 
 <nav class="pagination">
 {{ template "_internal/pagination.html" . }}
 </nav>

ERRO processing shortcode “theme/shortcodes/datacard.html” for page “customer/name@source.md”: template: theme/shortcodes/datacard.html:4:9: executing “theme/shortcodes/datacard.html” at <$data>: range can’t iterate over name@source.JSON

Any help for code instruction or advice for data-driven content best practice are warm welcome.

Thanks sincerely in advance.

2

UPDATE: If I try hardcode one customer , it works.

---
title: "ABC"
date: 2018-03-13T23:35:12+08:00
data_source: "abc.json"
description: ""
categories: ["developer"]
tags: ["rails", "COO"]
---
{{< datacard >}}

in layout/shorcodes/datacard.html

{{ with (index .Site.Data.customer "abc") }}
 bla bla do some stuff
{{ end }}

If I want to make re-use for all content/customer, it render nothing with no ERRO:

---
title: "ABC"
date: 2018-03-13T23:35:12+08:00
data_source: "abc.json"
description: ""
categories: ["developer"]
tags: ["rails", "COO"]
---
{{< datacard data_source="abc" >}}

in layout/shorcodes/datacard.html

{{ $data := .Get "data_source" }}
{{ with (index .Site.Data.customer "$data") }}
 bla bla do some stuff
{{ end }}

Appreciation for any suggestion!