site profile thumbnail

Description

After seeing @Maximosaurus create a CMS slider in Webflow with no code, I decided to attempt taking it a few steps further using custom code. I'm not a developer so cobbled together the code best I could. Some cleanup might be needed! It is dynamic, adding and removing slides automatically as Collection Items are added and removed. Styles can easily be updated in the editor without having to touch any code, with all item states shown in the CMS for easy editing (the code replaces them in the live version). The design includes arrows that respond based on first/last slide (in this case showing a different style when the ends are reached, or can set opacity to zero), and the nav bubbles function with the capability of including slide numbers. No looping or swipe support yet, but hope to add soon! Download the reference image on slide one for a breakdown of how to re-create this in a new document, and get the custom code on slide two. Enjoy! I welcome feedback and improvements!
cmsslidercustomcodeslideshowslidescollectioncollectionsdynamicautomatic-sliderslider-cms

Related Made in Webflow Projects