Tutorial to Create a CMS Slider on Webflow

Tutorial
3 min
Published on Mar 20, 2023
Updated on
CMS slider for Webflow with Finsweet attributes
Use AI to summarize this article
Key points

The goal of this tutorial is to utilize a collection (CMS) in Webflow as a data source to feed the slides of your Webflow slider.

This will enable you to create a customer review slider that automatically pulls data from your CMS.

(🍿 Video available at the end of this page)

Limitations of a Webflow Slider

Currently, it is not possible to natively use the CMS collections from your Webflow site as a data source for your CMS. But... fortunately... The Finsweet attributes are here to help.

Finsweet attributes are a set of 100% free products that you can easily integrate into your Webflow site (somewhat like plugins on WordPress) to add advanced functionalities to your website.

CMS Slider | Fs Attributes

Link to the official documentation for Finsweet's CMS slider

Finsweet Attributes CMS Slider Documentation
Official Finsweet Attributes CMS page

How to add the functionality in 3 steps?

  1. Copy the script and paste it into the head tag of your Webflow page
  2. Add the attribute "fs-cmsslider-element" to the "list" of your collection (the collection must be present on the page and connected to the collection you wish to use as a data source).
  3. Add the attribute "fs-cmsslider-element" to the "slider" element on your Webflow site

And... publish your site! 🎉🚀

Do you prefer video tutorials?

Discover how to integrate the CMS slider functionality on a Webflow site from A to Z in this French video tutorial.  (Solution with Finsweet Attributes)

Florian Bodelot
Florian Bodelot
Co-founder

Suggested articles

Abstract illustration representing the concept of server-side tracking
Documentation
Development

Understanding Server-Side Tracking Made Simple

Understanding Server-Side Tracking Made Simple
Illustration representing a Proof of Concept through visual explorations and creative references
Documentation
Development

Proof of Concept (POC): validating an idea before investing in a website

Proof of Concept (POC): validating an idea before investing in a website
photo of a European financial institution with European flags flying in the air and financial regulation terms: GDPR, MiFID II, AMF, PSD2, DORA, ORIAS
Documentation
Development

CGPs, VCs, Funds, Banks: What are the rules for Financial Website Compliance?

CGPs, VCs, Funds, Banks: What are the rules for Financial Website Compliance?

Want to turn your website into your most valuable asset?

Contact us today