1. Origine
Attributes est développé par Finsweet, le studio qui a aussi produit Client-First et d'autres outils incontournables de l'écosystème Webflow. La démarche de Finsweet est toujours la même : identifier les limites récurrentes de Webflow et y apporter des solutions configurables directement dans l'éditeur.
Attributes s'inscrit dans cette logique depuis ses débuts. La librairie est devenue une référence dans la communauté, utilisée à très large échelle dans l'écosystème Webflow mondial. Elle a connu une refonte majeure avec Attributes v2 (nouvelle architecture, nouveau CDN, compatibilité étendue), qui est aujourd'hui la version de référence.
2. Utilité
Sans Attributes, ajouter un filtrage CMS dynamique à un site Webflow demande d'écrire du JavaScript, ce qui alourdit le site, la charge de maintenance et crée des risques de régression à chaque mise à jour Webflow. Attributes remplace ce code custom par une configuration dans l'éditeur : on ajoute des attributs sur les éléments, la librairie fait le reste. Pour nous, c'est un gain de temps significatif sur chaque projet qui a des collections CMS à filtrer ou paginer.
3. Fonctionnalités
Ce qu'on utilise le plus : CMS Filter pour le filtrage dynamique, CMS Load pour la pagination et le « charger plus », et Mirror Click pour synchroniser des interactions entre éléments éloignés. La liste des composants s'allonge régulièrement, tous configurables sans code.
- CMS Filter : filtrage dynamique des collections par catégorie, tag ou champ
- CMS Load : pagination et bouton « Charger plus » au-delà de 100 items
- Mirror Click : synchronisation de clics entre éléments éloignés dans le DOM
- Input Counter : boutons d'incrément sur les champs numériques
- CMS Nest : imbriquer des listes CMS dans d'autres listes CMS
- Accordion : accordéons natifs configurables par attributs
4. Cas concrets
→ Sur un portfolio avec des centaines de réalisations, on intègre CMS Filter pour permettre aux visiteurs de filtrer par secteur, type de projet et année, sans rechargement de page. Le client peut ajouter des projets dans le CMS : les filtres se mettent à jour automatiquement sans aucune intervention technique.
→ Sur un blog avec plus de 100 articles, CMS Load permet d'afficher les articles par lots de 12 avec un bouton « Charger plus », sans limiter le catalogue ni recourir à une pagination serveur complexe. Le client gère l'intégralité de son contenu dans le CMS, et le site se comporte comme un outil éditorial natif.
5. Prix
Attributes by Finsweet est entièrement gratuit et open-source sous licence MIT, sans risque de changement de modèle tarifaire ni de dépendance commerciale. On fixe systématiquement la version dans l'URL CDN (plutôt que d'utiliser @latest) pour éviter les mises à jour non désirées en production.
6. Questions fréquentes
Faut-il savoir coder pour utiliser Attributes ?
Non. La configuration se fait entièrement dans l'éditeur Webflow via des attributs sur les éléments. La documentation Finsweet est détaillée avec des exemples visuels pour chaque composant.
Faut-il verrouiller la version en production ?
Oui, c'est notre pratique systématique. On fixe la version dans l'URL CDN plutôt que d'utiliser @latest, pour qu'une mise à jour de la librairie ne casse pas les projets sans validation préalable.
Attributes est-il compatible avec les interactions Webflow ?
Oui, les deux cohabitent généralement sans friction. Dans des cas avancés impliquant des interactions IX2 complexes, l'ordre de chargement des scripts ou une réinitialisation manuelle peut être nécessaire.
Peut-on utiliser plusieurs composants Attributes sur la même page ?
Oui, tous les composants Finsweet partagent un seul script CDN. Il n'y a pas de conflit entre CMS Filter, CMS Load et les autres composants sur une même page.