Build a Webflow CMS Slider – N…



In this video, we learn how to build a CMS-powered Webflow Slider using Attributes. We’ll go through the docs, the Designer, and turn a Webflow Collection List into a Slider Component.

TIMESTAMPS:
00:00 – Intro
00:31 – Live implementation of CMS Slider
01:30 – Overview of the Collection List
02:09 – How are slides created?
03:36 – Add Attributes to the Collection List
04:00 – Add Attributes to the Slider
04:45 – Overview of the Slider
06:09 – Visualise the Slider
09:14 – Thank You

ATTRIBUTES: Add advanced features to your Webflow project without code. Attributes is the new way to implement @Finsweet into your @Webflow project.

See all videos from the playlist:

———————————————–

// RESOURCES FROM THE VIDEO

Attributes:
Live Example:

Get help with implementation:…

source

This post was automatic generated with this wp-automatic-plugin

Squarespace Tutorial – 2023 (f… Previous post Squarespace Tutorial – 2023 (f…
How to Make School Management … Next post How to Make School Management …

36 thoughts on “Build a Webflow CMS Slider – N…

  1. For some reason this action isn't working on my site. I had someone from Relume Library proof it and every input was correct. Not sure why this is happening or what to do.

  2. Judging by the comments (and my experience) it looks like this library is partially broken. In my experience I can't use custom slider interactions and it consistently skips the second slide (actually completely ignores it from the count when inspecting the code.

    Any plans to fix this?

  3. I had to watch 3 other tutorials just to make sense of what was happening here. Granted, I am a beginner, so maybe this just isn't for someone like me. In the end, I ended up more confused.

  4. This works great but if you're using this for e-commerce and have a variable product it will not update the nested list for different product options.. I had a "more images" collection list that dynamically populates via a "colors" dropdown. I hope it's an easy fix. Maybe someone can chime in.

  5. When I compare what I see to what you have @00:45 – It says the following: *Custom code requires a hosting plan*. Is this a new requirement or is it that you've already paid for a hosting plan?

  6. Just wanted to say with this the amazing thing is, I had a client in the CMS have a multi image field and wanted the images in the multi field to be displayed as a slider. This sorted it out so quickly! Amazing!

  7. How would i implement this for showing not just one cms item at a time per slide, but showing say the 1st 8 items then sliding accross to the next 8 and so on?

  8. Man, I can not get this to work. I tried it on a Dynamic page and also a Static page and messed with everything. I can see the number of dots in my Slider correctly corresponds to the amount of collection items, so I know it is not completely broken but the slider appears empty.

  9. I love these tutorials, but for a beginner it gets very confusing when you just click elements in the viewport or cycle through with your arrows because no one knows what your working on at that point. use the NAVIGATOR to NAVIGATE pleeeeeasseeeeeeeee it would make the awsome video way more awsome especially when you mention a second collection list mid way

  10. Cheers, Joe!
    I had struggle with the Sliders a lot. This tutorial of yours seems that the slider isn't draggable.
    We all want Webflow to update them slider finally so it will be much more flexible:
    1. CMS
    2. Easy to visually modify
    3. Easy to animate and build interactions
    4. Draggable
    5. Pagination
    6. Clickable (link-box)
    7. Indipendent (so if you have more than one slider on the page you won't move the upper one by clicking the arrows of the top one or the other way around)
    8. If it is possible to deliver coffee time to times!
    T.Ricks had a good tutorials over sliders but still not the perfect sollution.
    Greetings G!

  11. Hey @Finsweet, is there any advice out on using slide change interactions with the CMS Slider? I haven't been able to figure it out, seems there's a couple others in the comments with the same problem. Thanks for building this!

  12. ISSUE: This does not work inside a CMS template page.

    I implemented this on a static page and it worked like a charm
    But when I tried adding this to a CMS based page (dynamic page) this didn't run

  13. I followed all the steps as you said (created collection items as I want them to look, added the code to the header, added attributes to the collection list and to the slider, and nothing shows in my slider!!

    Any ideas what the issue might be?!

  14. Hi, Joe! Thanks for the great tutorial. I've implemented in a website and it's working fine, except for one thing: "My interactions on Slider Change are not working". Can you give me a light on it? Thanks, man.

  15. Hi all! I'm wondering if there's something I'm missing to make the native "Slider change" interactions work with this solution? I've been having trouble animating. Thanks!

  16. Hi Joe, thanks for the amazing attributes update! Is there a fix for duplicate CMS data? If i limit to 5, then published slider will show 15 dots. Playing around with limit values, it seems to triple the designated amount of slides.

Leave a Reply

Your email address will not be published. Required fields are marked *


The reCAPTCHA verification period has expired. Please reload the page.

error: Content is protected !!