# Tutorial to Create a CMS Slider on Webflow

Tutorial3 minPublished on Mar 20, 2023Updated on ![CMS slider for Webflow with Finsweet attributes](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/6711753d5501c45c8c2ca01c_64760069e93084646c9ef22b_63591e2283a18d41613b4805_Open-Graph-webflow-cms-slider%252520(1).webp)Table of contents

[

Copied](#)[

](#)[

](#)[

](#)
- [H2 Example](#)

Use AI to summarize this article[

ChatGPT](#)[

Claude](#)[

Grok](#)[

Perplexity](#)[

Google AI](#)Key pointsThe 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](/webflow) (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**](https://www.finsweet.com/attributes/cms-slider)

![Finsweet Attributes CMS Slider Documentation](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/676423d4c3f671c71fa7eae3_6711753d5501c45c8c2ca020_64760069e93084646c9ef0ea_63591deeec502122796c9b0a_cms-slider-doc-finsweet.webp)Official Finsweet Attributes CMS page

### How to add the functionality in 3 steps?

- Copy the script and paste it into the head tag of your Webflow page
- 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).
- 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](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/678a725470105160732b0a8a_florian-website-vf.webp)Florian BodelotCo-founder[

](/team/florian-bodelot)[

](https://fr.linkedin.com/in/florian-bodelot-digidop)[

](https://twitter.com/florian_bodelot)+1200 readers

## Stay ahead of the curve!
Subscribe now for expert insights.

[Subscribe

](https://digidop.substack.com/subscribe)![Preview Digidop Newsletter](https://cdn.prod.website-files.com/6705382c85d21c496de94fa5/671231c436687e9d40d995e9_newsletter-digidop.webp)[Preview Newsletter

](https://digidop.substack.com/)

## Suggested articles

![Collage of homepages from B2B SaaS agencies including Digidop, Vydera, FlowNinja, OFF+BRAND, Yuri & Neil, MetaLab, Shakuro and Ramotion](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/6ab922fa556f97c19ea7db9a_Best%20B2B%20SaaS%20Agencies%20in%202026_EN.webp)DocumentationAll blog post

### Top 20 Web & Digital Agencies for B2B SaaS in 2026

[Top 20 Web & Digital Agencies for B2B SaaS in 2026](/blog/best-b2b-saas-agencies)Top 20 Web & Digital Agencies for B2B SaaS in 2026![Webflow Source interface showing AI agents, website editing, and role-based Views in a unified workspace.](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/6a9fa9f8608ffcc774c47eb7_source%20(1).webp)NewsDevelopmentAll blog post

### Webflow launches Source. Our take on this shift.

[Webflow launches Source. Our take on this shift.](/blog/webflow-launches-source)Webflow launches Source. Our take on this shift.![Citation rate by AI platform: ChatGPT 100%, Perplexity 100%, Gemini 67%, and Claude 0%.](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/6a9044c13914f1d6ac3e9161_citation.jpg)DocumentationAIAll blog post

### Make Your Website Visible in ChatGPT, Perplexity, and AI Answers

[Make Your Website Visible in ChatGPT, Perplexity, and AI Answers](/blog/make-your-website-visible-in-chatgpt-perplexity-and-ai-answers)Make Your Website Visible in ChatGPT, Perplexity, and AI Answers[See all articles

](/blog)Every great website  
starts with a conversation[Talk to an expert

](/contact)[Book a call

](/calendly)![Abstract composition of black and gold metallic ribbons with elegant light reflections and smooth gradients. A premium background conveying luxury, modernity, and innovation.](https://cdn.prod.website-files.com/6705382c85d21c496de94fa5/6a69a346549deffabdf98afa_shape-cta-footer.webp)