hugo-theme-zzo/layouts/partials/header/site-header.html

{{ if .IsHome }}
<header class="header">
    <!-- Slider main container -->
    <div class="swiper-container">
        <!-- Additional required wrapper -->
        <div class="swiper-wrapper">
            <!-- Slides -->
            {{ if .Site.Params.swiperCount }}
            {{ range $idx, $seq :=  (seq .Site.Params.swiperCount) }}
                <div class="swiper-slide">
                    {{ partial (print "header/slide-" $seq) . }}
                </div>
            {{ end }}
            {{ end }}
        </div>
        <!-- If we need pagination -->
        <div class="swiper-pagination"></div>
    </div>
</header>

<link rel="stylesheet" href="https://unpkg.com/swiper/css/swiper.min.css">
<script src="https://unpkg.com/swiper/js/swiper.min.js"></script>

<script>
    {{ $swiper := .Site.Data.swiper }}
    var options = JSON.parse({{ $swiper | jsonify }});

    var mySwiper = new Swiper('.swiper-container', options);
</script>

{{ end }}