jump to specific slide in slick

When data fetch from other custom module ===========




<div class="hs-section bios-next-profiles case-studies-next carousel-block light-grey-background hs-work-pagination-wrapper hs-what-next-pagination">
  <div class="page-center container">
    {% if module.heading %}
    <div class="hs-row text-center">
      <h3>{{ module.heading }}</h3>
    </div>
    {% endif %}
    <div class="hs-row">
      <div class="hs-col-md-10 hs-col-md-offset-1">
        <div class="owl-carousel next-items-carousel hidden-sm-down">
          {% set my_page = page_by_id(module.select_page) %}
          {% for item1 in my_page.widget_containers %}
          {% for item2 in item1.widgets %}
          {% if item2.body.widget_name == "Featured Content Group - Lane_Terralever_April2019" %}
          {% for item in item2.body.items %}
          {% set current = content.absolute_url == page_by_id(item.page_link).absolute_url %}
          {% if not current %}
          <div class="bio-item carousel-item ">
            <div class="bio-item-inner">
              <a class="link-overlay" href="{{ page_by_id(item.page_link).absolute_url }}"></a>
              <div class="rec-bg-img" style="background-image: url('{{ item.bg_image.src }}');"></div>
              <div class="bio-item-content">
                <h4>
                  {{ item.sub_title }}
                </h4>
                <p>
                  {{ item.title }}
                </p>
              </div>
            </div>
          </div>
          {% endif%}
          {% endfor %}
          {% endif %}
          {% endfor %}
          {% endfor %}
        </div>
      </div>
    </div><!-- row -->
  </div>
</div>

<script>
  $(document).ready(function(){
    $('.owl-carousel.next-items-carousel').slick({
      slidesToShow: 2,
      slidesToScroll: 1,
      autoplay: false,
      autoplaySpeed: 2000,
      infinite: true,
      arrows: true,
      dots: false,

      responsive: [
        {
          breakpoint: 800,
          settings: {
            slidesToShow: 1,
            slidesToScroll: 1
          }
        }
      ]
    });
    {% set my_page = page_by_id(module.select_page) %}
    {% for item1 in my_page.widget_containers %}
    {% for item2 in item1.widgets %}
    {% if item2.body.widget_name == "Featured Content Group - Lane_Terralever_April2019" %}
    {% for item in item2.body.items %}
    {% set current = content.absolute_url == page_by_id(item.page_link).absolute_url %}
    {% if current %} $('.owl-carousel.next-items-carousel').slick('slickGoTo', {{ loop.index }} - 2 ); {% endif %}
    {% endfor %}
    {% endif %}
    {% endfor %}
    {% endfor %}
  })
</script>









When data fetch from recent post  ===========


<div class="hs-section bios-next-profiles carousel-block light-grey-background">
  <div class="page-center container">
    <div class="hs-row text-center">
      <h3>Who's next?</h3>
    </div>
    {% set rec_posts = blog_recent_posts(module.select_blog, 25) %}
    <div class="hs-row">
      <div class="hs-col-md-10 hs-col-md-offset-1">
        <div class="owl-carousel next-items-carousel hidden-sm-down">
          {% for rec_post in rec_posts %}
          {% if rec_post.absolute_url !=  content.absolute_url %}
          <div class="bio-item carousel-item">
            <div class="bio-item-inner">
              <a class="link-overlay" href="{{rec_post.absolute_url}}"></a>
              <div class="rec-bg-img" style="background-image: url('{{ rec_post.featured_image }}');"></div>
              <h4>{{ rec_post.name}}</h4>
              {% if rec_post.topic_list %}
              <p>
                {% for topic in rec_post.topic_list %}
                {{ topic.name }}{% if not loop.last %} / {% endif %}
                {% endfor %}
              </p>
              {% endif %}
            </div>
          </div>
          {% endif %}
          {% endfor %}
        </div>
      </div>
    </div><!-- row -->
  </div>
</div>
<script>
  $(document).ready(function(){
    $('.owl-carousel.next-items-carousel').slick({
      slidesToShow: 2,
      slidesToScroll: 1,
      autoplay: false,
      autoplaySpeed: 2000,
      infinite: true,
      arrows: true,
      dots: false,

      responsive: [
        {
          breakpoint: 800,
          settings: {
            slidesToShow: 1,
            slidesToScroll: 1,

          }
        }
      ]
    });
    {% set rec_posts = blog_recent_posts(module.select_blog, 25) %}
    {% for rec_post in rec_posts %}
    {% if rec_post.absolute_url ==  content.absolute_url %}
    $('.owl-carousel.next-items-carousel').slick('slickGoTo', {{ loop.index }} - 2 );
    {% endif %}
    {% endfor %}
  })


</script>