How I can implement the Slick carousel in by Ken Wheeler In Dawn Theme

[sridharan]

Hi, how to implement the Slick carousel in Dawn theme.
How to implement the product thumbnail slider with variant change in the PDP page.
How to create a slick slider component with variant change.

[1531304506]

Did you find a solution? The slider component comes with dawn look awful.

[made4Uo]

Oh by the way, no need to download or use Ken Wheeler's code. The code is already in Dawn Theme, we just customizing it

[osama2kabdullah]

How I use this slider in Dawn theme? Where the docs?

[made4Uo]

Hi @osama2kabdullah 

If you are talking about the javascript code, you can check the global.js under the Asset folder

[Ishah]

Hi Pathfinder, thanks for your comprehensive guide. 

I followed it step by step but seem to have  goofed up somewhere,, I also made the big mistake of not working on a backup file. Is there anyway you could offer some help? 

[made4Uo]

Hi @Ishah. Let me know whats the problem. I notice I was missing a code yesterday and updated the code in the website.

[Ishah]

Thanks Pathfinder for touching base. I was able to redo the code and it is
now appearing as below. Can you take a look at this please and let me know
if this is the way it is supposed to work. I see the slider images start
from 4/5 although your store starts numbering from 1.

https://miracle-multiples.myshopify.com/products/triplet-t-shirt-onesie-set-best-friends-forever


Also by implementing the code my product lifestyle image has been included
in the thumbnails. I want to retain the product lifestyle image in its
original large format and only the variant color images should be in the
thumbnail slider.

I tried to reach out to shopify support but since the code now has a third
party code they are unable to help me out 😞 Do you have any suggestions
for this pls.

Thank you so much.

Brgds, Ayesha

[made4Uo]

@Ishah 

Hi the number is for current number items. The 4 means there is 4 items showing. I cannot decrease the number unless you are only showing 1 item. Regarding the large image. I am not sure how to do that either, since we are calling the big photos by the thumbnail. If you remove it from the thumbnail, there is no way to show those in the large image

[Ishah]

Thanks, the numbering is not a problem. Thanks for clarifying.

I see. I really need the lifestyle image to be shown as a big sized one. Is
there any way to alter the code to the thumbnail calls images from image#2
onwards? Alternatively is there a solution you know of that can work.

Thanks so much.

Brgds, Ayesha

[made4Uo]

@sridharan 

Hi, 

Just finish with the slick carousel that works in almost any shopify theme, including Dawn Theme. See video for link with code, No app needed

[Kumar2573]

we added the slick slider in dawn theme with variants swatches.

Demo store Url - https://devils-jitu.myshopify.com/products/test-product

password - test