Show all items

The most simple option - does not change the functionality of the collection list, simply adds the saving functionality.

ms-code-save-list="all" on the Collection List
ms-code-save-item on the Collection List Item
ms-code-save="{{ Slug }}" on the Save Button
ms-code-unsave="{{ Slug }}" on the Unsave Button

Using Finsweet Attributes? No problem ✅

This type of list should work flawlessly with CMS Load + CMS Filter. For pagination, you can use either CMS Load or native Webflow pagination and all should work as intended.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Designers Who Changed the Web
Read now
7 of the Best Examples of Beautiful Blog Design
Read now
What Will Website Be Like In 100 Years?
Read now
Why We Love Webflow (And You Should, Too!)
Read now
What Will Website Be Like In 100 Years?
Read now
Why We Love Webflow (And You Should, Too!)
Read now

Show saved items

Will only display the items which are saved. If none are saved, none will show up. You must use Finsweet CMS Load with the render-all mode in order for this to work! To get the script, go here.

fs-cmsload-element="list" on the Collection List
fs-cmsload-mode="render-all" on the Collection List
ms-code-save-list="saved" on the Collection List
ms-code-save-item on the Collection List Item
ms-code-save="{{ Slug }}" on the Save Button
ms-code-unsave="{{ Slug }}" on the Unsave Button

Using Finsweet Attributes? Read me ⚠️

For this list to work, you MUST use Finsweet CMS Load with the render-all mode. If you do that, you can also use Finsweet CMS Filter without any issues. Webflow native pagination & the pagination mode for CMS Filter will cause this list to have empty/incomplete pages.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Designers Who Changed the Web
Read now
7 of the Best Examples of Beautiful Blog Design
Read now
What Will Website Be Like In 100 Years?
Read now
Why We Love Webflow (And You Should, Too!)
Read now
What Will Website Be Like In 100 Years?
Read now
Why We Love Webflow (And You Should, Too!)
Read now

Show not saved items

Will only display the items which are not saved. If they are all saved, none will show up. You must use Finsweet CMS Load with the render-all mode in order for this to work! To get the script, go here.

fs-cmsload-element="list" on the Collection List
fs-cmsload-mode="render-all" on the Collection List
ms-code-save-list="unsaved" on the Collection List
ms-code-save-item on the Collection List Item
ms-code-save="{{ Slug }}" on the Save Button
ms-code-unsave="{{ Slug }}" on the Unsave Button

Using Finsweet Attributes? Read me ⚠️

For this list to work, you MUST use Finsweet CMS Load with the render-all mode. If you do that, you can also use Finsweet CMS Filter without any issues. Webflow native pagination & the pagination mode for CMS Filter will cause this list to have empty/incomplete pages.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
10 Things Nobody Told You About Being a Web Designer
Read now
10 Great Examples of Responsive Websites
Read now
How to improve Web Design Process
Read now
7 of the Best Examples of Beautiful Blog Design
Read now
5 Principles Of Effective Web Design
Read now
The Worst Advice We've Ever Heard About Web Design
Read now
Clone the buttons without CMS bindings!