blogcard.html

{{/* Get the parameters */}}
{{ $id := .Get "id" }}
{{ $providedUrl := .Get "url" }}

{{/* Look up the ID in data/blogcards.json */}}
{{ $cardData := index site.Data.blogcards $id }}

{{ if $cardData }}
  {{ $finalImage := "" }}

  {{/* Process the local image if it exists */}}
  {{ if $cardData.image }}
    {{ with resources.Get $cardData.image }}
      {{ $finalImage = (.Fill "300x150 Center").Permalink }}
    {{ end }}
  {{ end }}

  {{/* Fallback Image */}}
  {{ if not $finalImage }}
    {{ with resources.Get "images/placeholder.jpg" }}
      {{ $finalImage = (.Fill "300x150 Center").Permalink }}
    {{ end }}
  {{ end }}

  <a href="{{ $cardData.url }}" class="hugo-blog-card" target="_blank" rel="noopener noreferrer">
    {{ if $finalImage }}
      <div class="card-image" style="background-image: url('{{ $finalImage }}');"></div>
    {{ end }}
    <div class="card-content">
      <div class="card-title">{{ $cardData.title }}</div>
      <div class="card-url">{{ replaceRE `^https?://([^/]+).*` "$1" $cardData.url }}</div>
    </div>
  </a>

{{ else }}
  {{/* THE GRACEFUL FALLBACK: If JSON data is missing, but a URL was provided */}}
  {{ if $providedUrl }}
    <a href="{{ $providedUrl }}" target="_blank" rel="noopener noreferrer" class="hugo-blog-card-fallback">
      {{ $providedUrl }}
    </a>
  {{ else }}
    {{/* Absolute worst case: No JSON, no URL provided */}}
    <div style="color: red; border: 1px solid red; padding: 1rem;">
      Error: Blog card ID "{{ $id }}" not found, and no fallback URL provided.
    </div>
  {{ end }}
{{ end }}