shared-bulma-theme/layouts/shortcodes/single-title-imgs.html

{{ $title := .Get 0 }}
{{ $originals := (.Page.Resources.ByType "image") }}
<div class="columns is-img-preview is-bottom-marginless">
    {{ range $param := last (sub (len .Params) 1) .Params }}
    <!-- image -->
    {{ $items := split $param "|" }}
    {{ $src := (index $items 0) }}
    {{ $subtitle := (index $items 1) }}
    {{ $split_src := split $src "." }}
    {{ $extension := index $split_src (sub (len $split_src) 1) }}
    <div class="column is-bottom-paddingless">
        {{ if eq $extension "mp4" }}
            <video preload="auto" autoplay="autoplay" muted="muted" loop="loop" webkit-playsinline="">
                <source src="{{ $src }}" type="video/mp4">
                Your browser doesn't support mp4 video. :(
            </video>
        {{ else }}
            <a href="{{ $src }}" title="{{ $subtitle }}">
                {{- if eq $extension "png" -}}
                {{ $original := $originals.GetMatch (printf "*%s" (path.Base $src)) }}
                {{ $resized := $original.Resize "800x q90 jpg" }}
                <img src="{{ $resized.Permalink }}" alt="{{ $title }}">
                {{- else -}}
                <img src="{{ $src }}" alt="{{ $title }}">
                {{- end -}}
            </a>
        {{ end }}
    </div>
    {{ end }}
</div>

{{ if $title }}
<p class="has-text-centered is-italic has-text-grey-light">{{ $title }}</p>
{{ end }}