如何在光滑的滑块中设置两种不同类型的滑块？

Question

我的滑动滑块有问题。我的滑块应具有两种不同类型的幻灯片： 第一：图片 第二：列中有两张图片

我必须使用slick.js。

例如swiper.js中的滑块-https://antilophia.com/botswana

我有来自wordpress ACF画廊字段的图像：

HTML

 <?php if( !empty($gallery) ) : ?>
 <div class="block-activities-list__slider-container">
    <div class="block-activities-list__slider">
  <?php foreach( $gallery as $image ):?>
         <figure>
          <?php echo wp_get_attachment_image( $image['ID'], $size);?>
          </figure>
        <?php endforeach; ?>
            </div>
  </div>
 <?php endif; ?>

JS

const $ = jQuery.noConflict();

class ActivitiesSlider {
    constructor() {
        this.wrapper = document.querySelector('.block-activities-list__slider-container');
        this.slider = !!this.wrapper && this.wrapper.querySelector('.block-activities-list__slider');
    }

    init() {
        $(this.slider).slick({
            dots: false,
            infinite: true,
            slidesToScroll: 1,
            variableWidth: true,
            centerMode: true,
            rows: 0,

        });
    }
}

export default new ActivitiesSlider();

我不知道，该如何做，就像上面的示例一样。