HUGO

Partial not evaluated (rendering the command instead)

I want to use a partial to display team members in an _index.html (not the site homepage).

/layouts/partials/coreteam.html:

<div class="row justify-content-around">
  {{ range .Site.Data.team }}
  <figure>
    <img src="/images/{{ .image }}" alt="{{ .name }}" />
    <figcaption class="text-center">{{ .name }}</figcaption>
  </figure>
  {{end}}
</div>

I have a data file /data/team.json that looks like this:

[
  {
    "name": "Jim Smith",
    "image": "/images/avatar1.png"
  }
  ...
]

I include the partial like this (in /content/en/about/_index.html):

<div class="container">
  {{ partial "coreteam.html" . }}
  <h2 class="text-center">Join us!</p>
</div>

When I preview the site with hugo server, it shows the text of the call instead of evaluating it:

{{ partial “coreteam.html” . }}

I tried using it in a .md, but with the same results.

I tried {{< ... >}}, {{% ... %}}, but those returned a Hugo error.

I’m sorry if this is a basic question, but I’m stumped.

Environment:
GOOS=“windows”
GOARCH=“amd64”
GOVERSION="go1.14

Theme: Docsy

Thank you for your help.

A partial is a reusable bit of code, used in templates: https://gohugo.io/templates/partials/#readout

You want a shortcode, similar to a partial, but with special considerations for being included in content, as you are trying; partials don’t go in content files: https://gohugo.io/templates/shortcode-templates/

Move your “partial” to layouts/shotcodes and rework your code accordingly. :slight_smile:

So easy (once you pointed me in the right direction)… Thank you!

Steps I took:

  1. Moved coreteam.html to /layouts/shortcodes
  2. Changed incorrect partial call to {{< coreteam >}}
  3. Removed /index/ from json data file (duplicated in shortcode)

Thanks again for your quick response.

1 Like

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