Hi,
I've tried but im unable to do it. This is how my featured collection looks like:
{% unless featured_collection_width %}
{% assign featured_collection_width = 'small--one-half medium--one-third large--one-sixth' %}
{% endunless %}
{% unless featured_collection_size %}
{% assign featured_collection_size = '540x' %}
{% endunless %}
{% if collections[featured].image %}
{% assign collection_image = collections[featured].image %}
{% else %}
{% assign collection_image = collections[featured].products.first.featured_image %}
{% endif %}
<div class="grid-item {{ featured_collection_width }}">
{% capture collection_title %}{{ collections[featured].title | escape }}{% endcapture %}
<a href="{{ collections[featured].url }}" title="{{ 'collections.general.link_title' | t: title: collection_title }}" class="featured-box">
<div class="featured-box--inner">
<div class="featured-box--image {% unless collection_image == blank %} vertical-middle{% endunless %}">
{% if featured != blank %}
{% if collections[featured].image or collections[featured].products.first.featured_image %}
{%- assign image = collection_image -%}
{%- assign max_width = width | plus: 0 -%}
{%- assign max_height = height | plus: 0 -%}
{%- include 'image-logic' with width: max_width, height: max_height -%}
{%- assign img_url = image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
<div id="{{ wrapper_id }}" class="lazyload__image-wrapper no-js" style="max-width: {{ max_width }}px;">
<div {% if collection_image != blank %}style="padding-top:{{ 1 | divided_by: image.aspect_ratio | times: 100}}%;"{% endif %}>
<img class="no-js lazyload"
data-src="{{ img_url }}"
data-widths="[125, 180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
data-aspectratio="{{ collection_image.aspect_ratio }}"
data-sizes="auto"
alt="{{ collection_image.alt | escape }}">
</div>
</div>
{% else %}
{% capture current %}{% cycle 1, 2, 3, 4, 5, 6 %}{% endcapture %}
{{ 'collection-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
{% endif %}
{% else %}
{% capture current %}{% cycle 1, 2, 3, 4, 5, 6 %}{% endcapture %}
{{ 'collection-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
{% endif %}
</div>
{% unless collection_image == blank %}
<noscript>
<img src="{{ collection_image | img_url: '580x' }}"
srcset="{{ collection_image | img_url: '580x' }} 1x, {{ collection_image | img_url: '580x', scale: 2 }} 2x"
alt="{{ collection_image.alt }}" style="opacity:1;">
</noscript>
{% endunless %}
</div>
{% comment %}
<span class="featured-box--title">{% if collection_title != blank %}{{ collection_title }}{% else %}{{ 'homepage.featured_collection_rows.heading' | t }}{% endif %}</span>
{% endcomment %}
</a>
</div>Can you build in slick slider for me..?
Niels
