Heidis kock Klub - YAML problems

support
1

hi everyone,

I’ve picked up my pet project (again). A granddaughter from woman in Germany reached out to me and asked if I ever finished… That was so sweet! So I decided to pick it up again. I ran into an issue. I’ve made photos of roughly 100+ cards and with the power of AI I made a YAML file with the information. :heart: OCR.

image (1)
image (1)1024×1024 110 KB

I created a fresh installation and I added the recipes.YAML in my data folder. With this code
in the Layout folder I try to call the YAML file. And with a MD file in content I try to display it.

I’ve uploaded the entire project to GitHub

Who can point me in the right direction? I’m planning an about page where I will thank everyone for helping this project.

Directory

Scherm­afbeelding 2024-01-03 om 13.30.37
Scherm­afbeelding 2024-01-03 om 13.30.37506×1038 46.8 KB

Example and more info

The original publisher is still around and they where surprised… no one knew they once published these cards. It’s in a lot of German families. Also referred to as the red box.

10_01_2022, 13_58 Microsoft Lens(2)
10_01_2022, 13_58 Microsoft Lens(2)1870×2199 669 KB

10_01_2022, 13_58 Microsoft Lens(3)
10_01_2022, 13_58 Microsoft Lens(3)1870×2140 275 KB

Code

This text will be hidden


{{ range .Site.Data.recipes }}
  <article>
    <h2>{{ .title }}</h2>
    <p>Preparation time: {{ .prep_time }}</p>
    <h3>Ingredients:</h3>
    <ul>
      {{ range .ingredients }}
        <li>{{ . }}</li>
      {{ end }}
    </ul>
    <h3>Instructions:</h3>
    <ol>
      {{ range .instructions }}
        <li>{{ . }}</li>
      {{ end }}
    </ol>
  </article>
{{ end }}
2

There are multiple issues.

  1. The instructions from data file is a string, not an array.
  2. The recipes wasn’t be used by the recipes.md.

To fix this, you can either create a shortcode and then invoke the shortcode in Markdown file as follows.

image
image1150×790 79.7 KB

Or create a custom layout for rendering recipes, see also Template lookup order | Hugo.

3

Thanks @razon!

I believe i’ve updated YAML file to an array. Link to recipes.yaml (GitHub).
I’ve added the shortcode to the page, and added this code (correct?).

Code

{{ range .Site.Data.recipes }}

{{ .title }}

Preparation time: {{ .prep_time }}

Ingredients:

    {{ range .ingredients }}
  • {{ . }}
    • {{ end }}

Instructions:

    {{ range .instructions }}
  1. {{ . }}
    2. {{ end }}
{{ end }}
4

See https://yaml-multiline.info/.

The screenshot above already includes the changes, if it doesn’t work please provide further information, such as the error log.

5

I’ve looked at yaml-multiline.info. Is this better?

Orginal 
- title: "Grapefruit in a Glass"
  category: "Starters"
  ingredients:
    - "2 grapefruits"
    - "Sugar, to taste"
    - "Angostura, to taste (can be replaced with port wine or cherry liqueur)"
    - "4 cocktail cherries```
Updated 
title: "Grapefruit in a Glass"
category: "Starters"
ingredients:
  - "2 grapefruits"
  - "Sugar, to taste"
  - "Angostura, to taste (can be replaced with port wine or cherry liqueur)"
  - "4 cocktail cherries"
instructions: 
  "Halve the grapefruits horizontally and place them directly into serving dishes to preserve the juice. Precut the segments of the grapefruit flesh, using a special serrated knife. Lightly sugar to taste, add a few drops of Angostura to the center of each half, and top with a cocktail cherry. Serve fresh and well-chilled in glass or champagne bowls."
prep_time: "10 minutes"
cook_time: "0 minutes"

This error code is a bit puzzling,

can’t evaluate field title in type interface {}

error: error building site: “/Documents/kock/kock/content/pages/recipes.md:10:1”: failed to render shortcode “recipes”: failed to process shortcode: “/Documents/kock/kock/layouts/shortcodes/recipes.html:3:11”: execute of template failed: template: shortcodes/recipes.html:3:11: executing “shortcodes/recipes.html” at <.title>: can’t evaluate field title in type interface {}

6

Hi, I think you misunderstood my first point, in fact, you original data file is almost correct, excepct the instructions member.

You’re declaring it as a string ( folded block scalar style), but use it as an array.

7

The problem was my misunderstanding of YAML files. And reading them in a Hugo site. Thanks @razon for the help!

I’m going to continue work on this project.

Next on the list: adding images (original scans) to every recipe. After that, I’m asking an AI to help me with calories per serving (somehow this wasn’t an issue in the '70s in Germany)

8

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