<section id='image-carousel' class='splide'>
    <div class='splide__track'>
        <ul class='splide__list' style='list-style-type: none; list-style: none;'>
        {% for image in site.static_files %}
            {% if image.path contains 'appgallery/' %}
            <li class='splide__slide'>
                <img src="{{ image.path | relative_url }}" alt="" />
            </li>
            {% endif %}
        {% endfor %}
        </ul>
    </div>
</section>

<script>
document.addEventListener( 'DOMContentLoaded', function () {
    new Splide('#image-carousel', {
        type: 'loop',
        perPage: 3,
        autoPlay: true,
        pagination: false,
        // pagination: false,
        // focus: 'center',
    }).mount();
});
</script>