You have taken Webflow to a whole new level! Incredible work!!! The only *criticism* I have is that you move your floating head from the video. We can't see relevant information you are selecting, apart from that minor thing I am amazed.
From a visual perspective this is a decent hack and it works. That said it is a hack, not a full solution. The main problem here is that the DOM is rendering the CMS content twice which is not ideal. Setting the original instance to display: none only makes it not visible. Not great for having symantic markup rendered to the DOM.
Hey - yes, it is a hack. We are doing the most that we can with the access that Webflow gives us. There will never be a perfect integration with the native slider until Webflow gives us access to work with it directly. When they do allow us to build/customize/change components, we will be the first company to do it :)
Hey @Finsweet this is awesome! Just checking does this works for nested CMS sliders? Im not having any luck. The first Slider contains all the images, and rest show nothing. Is there a workaround?
Hey! Thank you for this, I've got it working nicely but my nav arrows and sliders have disappeared (showing in editor but not on live site) - Can anyone help with this?
Thanks for this guys! Will it work in the following example: I have a client that needs to display a slider inside each project. Each project is it's own CMS item with a lot of custom fields. I will need to add a multi image field to that collection, and then pull the images into the slider, having that slider adapt whether there are 2 images or 20 images in a project. Hope that makes sense!
@@Finsweet Thanks guys, but you didn't answer the question. I now realise I didn't put a question mark in it. Will it work for this example? Need to know if it's possible before I design it and tell them it's possible! :)
First off, this is great. So thanks. My question is: Is there a way to put multiple CMS items in each slide, as opposed to 1 item per slide? My example is that I have a CMS list of about 50+ color swatches. I want to make a slider that shows 3 color swatches per slide.
You're welcome, Nick! You can have 1 CMS item per slide! However, you could try using the multi-reference field. Create a collection for only color swatches. Create another collection - connect this with color swatches collection using the multi-reference field, and to build the CMS Slider.
This isn't a perfect solution, but I've been able to adjust the mask so that the slider shows numerous slides at once. Adjust the Mask to a percentage for the number of slides you want displayed. I have 5 slides in view at a time, so I set the mask to 20%. Here's a link to the video I used to set up the slider th-cam.com/video/a-OUeSHCInA/w-d-xo.html. The only downside is that the slider still only advances by one slide at a time.
Hi Joe, is it possible to combine 2 multi-image fields into 1 list to show in 1 slider? I tried to do this with Attributes CMS Combine, but maybe it's a bridge too far..
@finsweet, can you add this CMS slider solution to the rich-text element on a collection page? Really want to manage media in rich-text elements using FLEXBOX, GRID, SLIDER, and LIGHTBOX on a CMS post.
@@juhik.9969 I don't remember how but I remember that I watched another video and it helped, it's called "Build Webflow CMS Dynamic Slider from Scratch - How To" Try to watch it and repeat everything :)
Hi, thanks for sharing this tutorial! Do I need to use different javascript for when I have two of these CMS sliders (connected to different collections) on a page? They both work fine when they are the only CMS slider on the page but when both are on a page one of them doesn't work... Thanks :)
You're welcome! Everything can be placed in the same script tag. You can create multiple instances of FsLibrary. Message us on sweetjs.io and we'll help you with implementation!
I really tried loving this solution, but it has several drawbacks: the slide nav's style isn't readily accessible and the basic slide object has its display options grayed out, which is quite limitative. But a great workaround nonetheless is aboslutely necessary.
Thanks for the feedback! You can always jump into Webflow Designer preview to take a closer look. Check it out - webflow.com/website/How-to-Fin-sweet-CMS-Library
Hi, you mix the setup with the demo of the setup which is confusing. Next time please do all setup from start to finish and keep demo of the setup separate. You also block a lot of the important setup with your camera. For someone who is new to webflow following this is very difficult.
Let me just reiterate an earlier point made regarding the face box - it's not necessary or particularly helpful. Moreover, you're actually diminishing the usefulness of the lesson by obscuring content that's being talked about. Perhaps an ego check is in order.
Yes, this is really really helpful! Great! But placing the video insert elsewhere would make it even better.
You have taken Webflow to a whole new level! Incredible work!!! The only *criticism* I have is that you move your floating head from the video. We can't see relevant information you are selecting, apart from that minor thing I am amazed.
You're welcome!! Thanks for the feedback!!
@@Finsweet yes please, I can't see
Hey buddy. You just solved a lot of people's problems. Thank you so much for this!
You're welcome!!!
From a visual perspective this is a decent hack and it works. That said it is a hack, not a full solution. The main problem here is that the DOM is rendering the CMS content twice which is not ideal. Setting the original instance to display: none only makes it not visible. Not great for having symantic markup rendered to the DOM.
Hey - yes, it is a hack. We are doing the most that we can with the access that Webflow gives us. There will never be a perfect integration with the native slider until Webflow gives us access to work with it directly. When they do allow us to build/customize/change components, we will be the first company to do it :)
Finsweet I agree, webflow really need to build a proper solution for this. Good work! 👍
Thanks! Very helpful! Exactly what I was looking for! Works perfectly! 👍🏼
You're welcome!!!
Hey @Finsweet this is awesome! Just checking does this works for nested CMS sliders? Im not having any luck. The first Slider contains all the images, and rest show nothing. Is there a workaround?
Hey! Thank you for this, I've got it working nicely but my nav arrows and sliders have disappeared (showing in editor but not on live site) - Can anyone help with this?
Hey! Can you message us on sweetjs.io? One of our devs will look into this for you!
Thank you for sharing so much free content! Really helpful :)!
You're welcome!!!
Thanks for sharing! Is it possible to have two slides on one page?
Yes, it should be possible. You'd need to play with Overflow and width of the slide. Please post this use-case on forum.webflow.com/
Following up - @Ruben, did you manage to find a solution in order to have 2 sliders on one page? @Finsweet or any news from your site?
Great tutorial. But is there a way that this can integrate with Multi-reference which I can choose which slides to be shown.
Thanks for this guys! Will it work in the following example:
I have a client that needs to display a slider inside each project. Each project is it's own CMS item with a lot of custom fields. I will need to add a multi image field to that collection, and then pull the images into the slider, having that slider adapt whether there are 2 images or 20 images in a project.
Hope that makes sense!
Sounds awesome!!! Good luck with it!
@@Finsweet Thanks guys, but you didn't answer the question. I now realise I didn't put a question mark in it. Will it work for this example? Need to know if it's possible before I design it and tell them it's possible! :)
First off, this is great. So thanks. My question is: Is there a way to put multiple CMS items in each slide, as opposed to 1 item per slide? My example is that I have a CMS list of about 50+ color swatches. I want to make a slider that shows 3 color swatches per slide.
You're welcome, Nick! You can have 1 CMS item per slide! However, you could try using the multi-reference field. Create a collection for only color swatches. Create another collection - connect this with color swatches collection using the multi-reference field, and to build the CMS Slider.
Nick - Curious if you found a solution for this!
I'm wondering the same thing, Nick. Did you find a solution for that?
This isn't a perfect solution, but I've been able to adjust the mask so that the slider shows numerous slides at once. Adjust the Mask to a percentage for the number of slides you want displayed. I have 5 slides in view at a time, so I set the mask to 20%. Here's a link to the video I used to set up the slider th-cam.com/video/a-OUeSHCInA/w-d-xo.html. The only downside is that the slider still only advances by one slide at a time.
Hi Joe, is it possible to combine 2 multi-image fields into 1 list to show in 1 slider? I tried to do this with Attributes CMS Combine, but maybe it's a bridge too far..
This is close to what I need but is there a way to use a nested CMS within a CMS slider?
Is it possible to add multiple sliders on the same page? If yes, how can i do it?
Thank you!!
@finsweet, can you add this CMS slider solution to the rich-text element on a collection page?
Really want to manage media in rich-text elements using FLEXBOX, GRID, SLIDER, and LIGHTBOX on a CMS post.
I can't paste that divblock inside the slider, because it says I can't copy smth with dynamic content inside the slider, what should I do?
Hey, Denis! Have a look at this article - university.webflow.com/lesson/copy-and-paste-between-projects
@@Finsweet thx I saw another video on your channel and it helped:)
@Denis Salin Hey how did you figure this out? I'm having the same issue
@@juhik.9969 I don't remember how but I remember that I watched another video and it helped, it's called
"Build Webflow CMS Dynamic Slider from Scratch - How To"
Try to watch it and repeat everything :)
Hi, thanks for sharing this tutorial!
Do I need to use different javascript for when I have two of these CMS sliders (connected to different collections) on a page?
They both work fine when they are the only CMS slider on the page but when both are on a page one of them doesn't work...
Thanks :)
You're welcome! Everything can be placed in the same script tag. You can create multiple instances of FsLibrary. Message us on sweetjs.io and we'll help you with implementation!
fantastic job, just wished you moved your face to the top right, top centre, etc... move around so I can see what you are referring to.
I really tried loving this solution, but it has several drawbacks: the slide nav's style isn't readily accessible and the basic slide object has its display options grayed out, which is quite limitative. But a great workaround nonetheless is aboslutely necessary.
great video, can you move your face elsewhere? keen to see the structure on the left-side! :)
Thanks for the feedback! You can always jump into Webflow Designer preview to take a closer look. Check it out - webflow.com/website/How-to-Fin-sweet-CMS-Library
How about actually showing how to build this? Oh my God!
Done, check out - th-cam.com/video/FjuvDGbJayY/w-d-xo.html
Hi, you mix the setup with the demo of the setup which is confusing. Next time please do all setup from start to finish and keep demo of the setup separate. You also block a lot of the important setup with your camera. For someone who is new to webflow following this is very difficult.
Am I the only one that this has just not worked for??
Would you please remove your face in next videos as I wanted to have a close look at the elements but your head blocked the whole view, no offence.
Let me just reiterate an earlier point made regarding the face box - it's not necessary or particularly helpful. Moreover, you're actually diminishing the usefulness of the lesson by obscuring content that's being talked about. Perhaps an ego check is in order.