Prefer data-slick to general settings

When using the attribute “data-slick”…

<div class="slick" data-slick='{"dots":false,"arrows":true}'>

together with a set of general options…

$('.slick').slick({
    dots: true,
    infinite: true
});

the default options are preferred: In the example above, the slider has dots although the setting in the data-attribute says “no dots”.

For me, it seems more logical if the settings in “data-slick” overwrites the general options. For usage in a CMS this is highly recommended.

[Dan503]

This is the completely wrong approach in my mind.

The JS will typically be called on a generic .carousel class.

The data attribute is called on the individual carousels. This gives much finer control of the settings to the data attribute.

If there are arguments for both sides then can we have a setting that determines what batch of settings have priority?

[vikaspaturi]

Hi Team,

How do we pass this as the Data attribute, I am looking for customPaging for below.

$(“.cmp-carousel-single”).slick({ slidesToShow: 1, dots: true, infinite: false, arrows: true, customPaging: function (slider, i) { return ( ‘<img src="’ + $(slider.$slides[i]) .find(“.cmp-carousel__content-wrapper”) .attr(“data-dot-title”) + ‘">’ ); }, });