themes/coceu/layouts/partials/featured-speakers.html

<section class="section featured-speakers">
    <div class="container">
      <div class="heading mb-4 text-center">
        <h2>Featured Speakers</h2>
        <p>Check out our keynote speakers as well as our <a href="/speakers">full list of speakers</a>.</p>
      </div>
      <div id="speakers" class="speaker-strip">
        {{ range sort (where (where (where .Site.Pages.ByTitle "Type" "speakers") "Kind" "term") "Params.featured" true) "Params.featured_order" }}
        <div class="speaker-item">
          <div class="speaker-block">
            <div class="headshot-box">
              <a href="{{.RelPermalink}}">
                {{ $img := resources.Get (index .Params.images 0) }}
                {{ $imgp := $img.Resize "400x webp" }}
                <img src="{{$imgp.RelPermalink }}" alt="Photo of {{.Title}}" class="img-fluid rounded-circle">
              </a>
            </div>
            <div class="speaker-info text-center">
              <h3 class="mt-3"><a href="{{.RelPermalink }}">{{ .Title }}</a></h3>
              <h4 class="">{{ .Params.designation }}</h4>
            </div>
          </div>
        </div>
        {{ end }}
      </div>
      <hr class="section-divider">
    </div>
  </section>