Dawn Slide Component

Solved

When reading the link below, it says Dawn will have a slider. Either I can't find it, or it hasn't been shipped in the last version. Does anyone have insight into this?

 

https://ux.shopify.com/next-generation-theme-design-5aae94f6d44c


Edit: I just found a slider example in a section named "featured-blog" which doesn't seem enabled. I don't know if it hasn't been completed yet or if we're supposed to figure out how to implement it on our own.

Anthony_David_
Trailblazer
222 29 87

New Slider is available in DAWN, check Editor @FervEngineering 

Thanks 

Shopify Expert - Theme customization | Design | Marketing | Product Sales
Hire Me: anthonyuidesigner@gmail.com
Whatsapp ( Click on number )- +33 6 28 93 62 05
0 Likes

@Anthony_David_ Are you seeing it in your customizer? I see the code for it when I pull it locally, but it’s not available as a section or block. 

lukezhang
New Member
1 0 0

I don't see it either. Any pointer will be helpful.

0 Likes
marcoswatanabe
Shopify Partner
19 2 5

This is an accepted solution.

There is a slider component that seems to be used on mobile only, in some sections.

The component CSS and JS can be found at:

/assets/component-slider.css

/assets/slider.js

It uses CSS Flex and you'd have to tweak the CSS to show it on desktop too.

If my answer was helpful then please Like and Accept Solution :)
If you need help with design, development or marketing your store, talk to one of our experts at http://whymatters.co.uk/
0 Likes

@marcoswatanabe Thanks, I found its usage in featured-collection.liquid and is used as below-looks like they created a custom HTML element for it. I'll accept your answer as the solution.

 

 

 

<slider-component class="slider-mobile-gutter">

 

 

jaymewada213
New Member
1 0 0

Thanks for the quick solution. Can you also explain how can we enable this product slide on the desktop version also. 
I am struggling to be slider to be displayed on desktop also on the DAWN theme

0 Likes

It's going to be a little bit involved to get it to work. You'll need to get the products to keep the horizontal grid and unhide the slider buttons like mobile uses. All the classes are already available, but you might want to make an alternate version so it's not confusing when someone's trying to debug and they see class="mobile-xxx" when the viewport is at desktop size.

0 Likes
sakku_9090
New Member
6 0 0

I tried everything, by playing with classes and liquid, ALAS! no workaround found!

There is a solution but no accepted! Unless, I don't copy the slider component, and duplicate it and one I call for desktop and other for mobile/tablet version, it doesn't work for desktop!

But duplicating the code is nothing but redundancy.

Does anyone has any solution yet???

0 Likes
Marb
New Member
1 0 0

+1 for this, still looking for a solution aswell. Hope this gets updated soon

0 Likes