Портфолио (фотки слайдером + lightbox)

HTML

<?php 
$images = get_field('наши_работы');
if( $images ): ?>
<div class="portfolio" id="portfolio">
    <div class="container">
        <div class="content-title"><?php the_field('заголовок_блока_наши_работы'); ?></div>
        <div class="portfolio-slider regular">
            <?php foreach( $images as $image ): ?>
            <a class="portfolio--inner" href="<?php echo esc_url($image['url']); ?>" data-rel="lightbox-portfolio">
                <div class="miniature miniature-hover">
                    <img src="<?php echo esc_url($image['sizes']['medium_large']); ?>" alt="<?php echo esc_attr($image['alt']); ?>">
                </div>
            </a>
            <?php endforeach; ?>
        </div>
    </div>
</div>
<?php endif; ?>

LESS

.portfolio{
    padding-bottom: 120px;
    
    @media(max-width: 800px){
        padding-bottom: 80px;
    }
    .portfolio--inner{
        display: block;
        text-decoration: none;
        
        .miniature{
            height: 250px;
            
            @media(max-width: 800px){
                height: 200px;
            }
        }
    }
}

JS

(function(){
    $(document).ready(function(){
        var owl = $('.portfolio-slider');
        owl.owlCarousel({
            loop: true,
            items: 3,
            margin: 30,
            nav: true,
            smartSpeed: 600,
            responsiveClass: true,
            responsive: {
                0: {
                    items: 1,
                    margin: 30,
                },
                600: {
                    items: 1,
                },
                1000: {
                    items: 3,
                }
            }
        });
    });
})();