carousel.html

{{ .Scratch.Set "height" (.Get "height") }}
{{ .Scratch.Set "unit" (.Get "unit") }}
{{ .Scratch.Set "ordinal" .Ordinal }}
{{ .Scratch.Set "items" (.Get "items") }}
<div id="carousel{{ .Ordinal }}" class="carousel" duration="{{ .Get `duration` }}">
    <ul>
      {{ range $index, $slide := .Site.Data.carousel.images }}
        <li id="c{{ $.Scratch.Get "ordinal" }}_slide{{ add $index 1}}" style="min-width: calc(100%/{{ $.Scratch.Get "items" }}); padding-bottom: {{ $.Scratch.Get "height" }}{{ $.Scratch.Get "unit" }};"><img src="{{ $slide.image }}" alt="" /><div><div>{{ $slide.content_html }}</div></div></li>
      {{ end }}
    </ul>
    <ol>
      {{ range $index, $page := .Site.Data.carousel.images }}
        <li><a href="#c{{ $.Scratch.Get "ordinal" }}_slide{{ add $index 1 }}"></a></li>
      {{ end }}
    </ol>
    <div class="prev">&lsaquo;</div>
    <div class="next">&rsaquo;</div>
</div>