author_media.html

<div class="media author-section is-flex" resource="{{ post.permalink }}" typeof="schema:BlogPosting">
  <div class="media-left author-images is-align-self-center">
{% set authors_data = load_data(path="authors.json") -%}
{% for author in post.authors -%}
<figure class="image is-48x48 is-inline-block" property="schema:contributor" resource="https://teckids.org/authors/{{ author }}/" typeof="schema:Person">
      {% set meta = get_image_metadata(path="authors/" ~ author ~ ".jpg", allow_missing=true) -%}
      {% if meta -%}
        {% set image = resize_image(path="authors/" ~ author ~ ".jpg", width=48, height=48) -%}
        <img property="schema:image" class="is-rounded" src="{{ image.url }}" alt="Benutzerbild von {{ authors_data[post.authors.0].display_name }}" />
      {% else -%}
      <div class="is-flex is-fullheight">
        <span class="fa-stack fa-lg is-block is-align-self-center">
          <i class="fa-solid fa-circle fa-stack-2x"></i>
          <i class="fa-solid fa-{{ author | truncate(length=1, end="") | lower() }} fa-stack-1x fa-inverse"></i>
        </span>
      </div>
      {% endif -%}
    </figure>
{% endfor %}
  </div>
  <ul class="media-content is-align-self-center">
    <div class="title is-5">
{% for author in post.authors -%}
<span resource="https://teckids.org/authors/{{ author }}/" typeof="schema:Person" class="is-text-nowrap"><span property="schema:name">{{ authors_data[author].display_name }}</span></span>{% if not loop.last %}, {% endif %}
{% endfor %}
    </div>
  </ul>
</div>