Extract exif data solution brainstorming

support
6

Workflow:

  1. Create leaf bundle

    hugo new content/photos/2022-06-24-post-title

  2. Copy JPEG images to leaf bundle

  3. Create data file

    cd content/photos/2022-06-24-post-title
exiftool -json *.jpg > exif.json

Resulting structure:

content/
├── photos/
│   └── 2022-06-24-post-1/
│       ├── a.jpg
│       ├── b.jpg
│       ├── exif.json
│       └── index.md
└── _index.md
exif.json 
[{
  "SourceFile": "a.jpg",
  "ExifToolVersion": 11.88,
  "FileName": "a.jpg",
  "Directory": ".",
  "FileSize": "17 kB",
  "FileModifyDate": "2022:06:24 10:48:13-07:00",
  "FileAccessDate": "2022:06:24 10:51:09-07:00",
  "FileInodeChangeDate": "2022:06:24 10:48:13-07:00",
  "FilePermissions": "rw-------",
  "FileType": "JPEG",
  "FileTypeExtension": "jpg",
  "MIMEType": "image/jpeg",
  "ExifByteOrder": "Big-endian (Motorola, MM)",
  "ImageDescription": "A kitten",
  "XResolution": 72,
  "YResolution": 72,
  "ResolutionUnit": "inches",
  "YCbCrPositioning": "Centered",
  "ImageWidth": 600,
  "ImageHeight": 400,
  "EncodingProcess": "Baseline DCT, Huffman coding",
  "BitsPerSample": 8,
  "ColorComponents": 3,
  "YCbCrSubSampling": "YCbCr4:2:0 (2 2)",
  "ImageSize": "600x400",
  "Megapixels": 0.240
},
{
  "SourceFile": "b.jpg",
  "ExifToolVersion": 11.88,
  "FileName": "b.jpg",
  "Directory": ".",
  "FileSize": "16 kB",
  "FileModifyDate": "2022:06:24 10:48:13-07:00",
  "FileAccessDate": "2022:06:24 10:51:09-07:00",
  "FileInodeChangeDate": "2022:06:24 10:48:13-07:00",
  "FilePermissions": "rw-------",
  "FileType": "JPEG",
  "FileTypeExtension": "jpg",
  "MIMEType": "image/jpeg",
  "ExifByteOrder": "Big-endian (Motorola, MM)",
  "ImageDescription": "Another kitten",
  "XResolution": 72,
  "YResolution": 72,
  "ResolutionUnit": "inches",
  "YCbCrPositioning": "Centered",
  "ImageWidth": 600,
  "ImageHeight": 400,
  "EncodingProcess": "Baseline DCT, Huffman coding",
  "BitsPerSample": 8,
  "ColorComponents": 3,
  "YCbCrSubSampling": "YCbCr4:2:0 (2 2)",
  "ImageSize": "600x400",
  "Megapixels": 0.240
}]

layouts/photos/single.html 
{{ $exif := dict }}
{{ with .Resources.Get "exif.json" }}
  {{ $exif = . | transform.Unmarshal }}
{{ end }}

{{ range .Resources.Match "*.jpg" }}
  {{ $imageDescription := "" }}
  {{ $imageSize := "" }}
  {{ with where $exif "SourceFile" "eq" .Name }}
    {{ with index . 0 }}
      {{ $imageDescription = .ImageDescription }}
      {{ $imageSize = .ImageSize }}
    {{ end }}
  {{ end }}
  <figure>
    <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="{{ $imageDescription }}">
      <figcaption>{{ $imageDescription }} ({{ $imageSize }})</figcaption>
  </figure>
{{ end }}

You would, obviously, need to modify the template code to use your Cloudflare images instead of the locally stored image(s).

2 Likes