Système de gestion de contenu (CMS) : Utiliser des éléments de saisie pour permettre aux visiteurs de filtrer le contenu

Temps de lecture : 17 min
Utilisez des éléments de saisie tels que les listes déroulantes ou les boutons Radio pour permettre aux visiteurs du site de filtrer le contenu qui apparaît dans les répéteurs, les galeries et les tableaux. Cet article vous guide dans la connexion d'éléments de saisie à un ensemble de données qui relie votre collection du Système de gestion de contenu (CMS) au contenu du site en ligne. 

Chaque élément de saisie se connecte à un champ de collection spécifique pour afficher les valeurs uniques du champ comme options de filtre. Lorsque les visiteurs sélectionnent une option de filtre, seuls les éléments avec une valeur de champ correspondante apparaissent dans le répéteur connecté, la galerie ou le tableau. Vous pouvez également ajouter un filtre conditionnel qui modifie le comportement du filtre. Par exemple, vous pouvez ajouter la condition « N'est pas » pour créer un filtre qui affiche les éléments qui ne correspondent pas à la sélection du visiteur. 

Par défaut, lorsque les visiteurs sélectionnent un filtre, le contenu change immédiatement. Cependant, vous pouvez ajouter un bouton « Appliquer le filtre » si vous souhaitez que les filtres des visiteurs ne soient appliqués qu'après avoir cliqué sur un bouton distinct. Vous pouvez également ajouter un bouton de réinitialisation sur lequel les visiteurs peuvent cliquer pour effacer instantanément tous les filtres qu'ils ont définis.
Avant de commencer :

Étape 1 | Ajouter des éléments de saisie définis pour filtrer le contenu

Accédez à la page de votre Éditeur où vous souhaitez que les visiteurs filtrent le contenu qui apparaît dans un répéteur, une galerie ou un tableau. Ajoutez ensuite les éléments de saisie que vous souhaitez que les visiteurs utilisent pour filtrer le contenu. Si vous ajoutez plusieurs éléments de saisie, vous pouvez configurer chacun d'eux pour qu'il filtre un champ de collection différent. 

Vous pouvez choisir parmi les éléments de saisie suivants qui permettent le filtrage : boutons radio, cases à cocher, menu déroulant, tags de sélection, ou barre de défilement (curseurs de plages uniquement). N'oubliez pas que chaque élément de saisie a des limitations aux types de champs qu'il peut filtrer. 
Éditeur Wix
Éditeur Studio
  1. Accédez à votre Éditeur.
  2. Accédez à la page qui comprend le répéteur, la galerie ou le tableau que vous souhaitez que les visiteurs filtrent. 
  3. Cliquez sur Ajouter des éléments  à gauche de l'éditeur.
  4. Cliquez sur Saisie.
  5. Sous Sélection, cliquez sur le type d'élément de saisie que vous souhaitez que les visiteurs utilisent pour filtrer le contenu. Choisissez parmi les éléments suivants qui permettent le filtrage : boutons radio, cases à cocher, menu déroulant, tags de sélection, ou barre de défilement (curseurs de plages uniquement) 
  6. Cliquez et faites glisser l'élément de saisie concerné sur la page. 
Une capture d'écran de l'ajout de l'élément menu déroulant dans l'Éditeur.
  1. (Facultatif) Répétez les étapes 3 à 6 ci-dessus pour ajouter d'autres éléments de saisie que vos visiteurs utiliseront pour filtrer le contenu. 

Étape 2 | Connecter votre ou vos éléments de saisie au système de gestion de contenu (CMS)

Connectez chaque élément de saisie au même ensemble de données qui se connecte à votre répéteur, votre galerie ou votre tableau. Choisissez ensuite le champ de collection que chaque élément de saisie filtrera. Les éléments de saisie afficheront chaque valeur unique du champ de collection connecté. Lorsqu'un visiteur effectue une sélection dans la saisie, le répéteur, la galerie ou le tableau affiche uniquement les éléments qui correspondent au champ sélectionné. 

Vous pouvez également ajouter un filtrage conditionnel qui s'applique au filtre. Par exemple, ajoutez les conditions « N'est pas », « N'est pas égal à » ou « N'inclut pas » pour créer un filtre qui affiche les éléments qui ne correspondent pas au champ que votre visiteur sélectionne. Lorsque vous ajoutez une condition au filtre, le titre du champ et le texte de l'espace réservé sur votre élément de saisie s'ajuste automatiquement pour informer les visiteurs de ce que fait le filtre (ex. « Exclure par champ »).  
L'ajout de filtres et de tris au dataset affecte également les éléments de saisie :
Vos éléments de saisie se connectent à un dataset qui récupère le contenu de ses champs de collection connectés. Si vous ajoutez des filtres au dataset pour exclure des éléments de l'affichage, les éléments exclus et leur contenu de champ ne sont pas transmis aux éléments de saisie. Cela signifie que vos éléments de saisie n'afficheront que les valeurs de champ uniques des éléments qui sont inclus dans le dataset. Les conditions de tri du dataset affectent également l'ordre dans lequel les sélections de champs apparaissent dans les éléments de saisie. 
Éditeur Wix
Éditeur Studio
  1. Dans votre Éditeur, cliquez sur l'élément de saisie que vous venez d'ajouter. 
  2. Cliquez sur l'icône Connecter au CMS
  3. Cliquez sur Filtrer le contenu
Une capture d'écran de la sélection de l'option Filtrer le contenu lors de la connexion d'un élément de saisie au système de gestion de contenu (CMS).
  1. Cliquez sur le menu déroulant Choisir un dataset et sélectionnez le même dataset qui se connecte au répéteur, à la galerie ou au tableau que vous souhaitez que les visiteurs filtrent. 
  2. Cliquez sur le menu déroulant Filtrer le contenu par et sélectionnez le champ de collection que les visiteurs utiliseront pour filtrer le contenu qui s'affiche. 
  3. (Facultatif) Ajoutez une condition qui affecte le fonctionnement du filtre :
    1. Cliquez sur Filtrage avancé. 
    2. Cliquez sur la liste déroulante Condition et sélectionnez un opérateur qui contrôle l'application du filtre (ex. n'est pas, n'est pas égal à, n'inclut pas).
      Remarque : Les conditions varient en fonction du type d'élément de saisie et du type de champ connecté. Consultez la section Conditions de filtrage avancées pour chaque élément de saisie ci-dessous pour obtenir de plus amples détails. 
Une capture d'écran des options de connexion au CMS pour un élément de saisie Liste déroulante configuré pour filtrer le contenu.
  1. Répétez ces étapes pour chaque élément de saisie que vous souhaitez que les visiteurs utilisent pour filtrer le contenu. 
  2. Cliquez sur Aperçu pour tester en utilisant vos éléments de saisie comme filtres.
  3. Cliquez sur Publier si vous êtes prêt à mettre en ligne les modifications. 

Conditions de filtrage avancées

Cliquez ci-dessous pour consulter les conditions de filtrage avancées disponibles pour chaque élément de saisie :
Une capture d'écran de la condition de filtrage avancé pour un curseur de plage configuré pour filtrer le contenu.

(Facultatif) Étape 3 | Ajouter un bouton pour appliquer les filtres

Si vous souhaitez que les filtres sélectionnés par vos visiteurs soient appliqués après avoir cliqué sur un bouton distinct, vous pouvez créer un bouton « Appliquer les filtres ». Lorsque les visiteurs cliquent sur ce bouton, tous les filtres des éléments de saisie qu'ils ont sélectionnés sont appliqués. Sans cela, les filtres sont appliqués dès que les visiteurs les sélectionnent dans chaque élément de saisie. 
Éditeur Wix
Éditeur Studio
  1. Cliquez sur Ajouter des éléments  sur le côté gauche de l'Éditeur.
  2. Cliquez sur Bouton.
  3. Cliquez sur le bouton que vous souhaitez utiliser pour appliquer les filtres et faites-le glisser sur la page. Vous pouvez utiliser n'importe lequel des types de boutons suivants : boutons assortis, boutons texte et icône ,  boutons icône, ou boutons image.
    Suggestion : Vous pouvez également ajouter une image et l'utiliser comme bouton « Appliquer les filtres ». 
  4. Cliquez sur Modifier le texte et saisissez le texte que vous souhaitez afficher sur le bouton (ex. « Appliquer les filtres »). 
  5. Cliquez sur l'icône Connecter au CMS .
  6. Cliquez sur le menu déroulant Choisir un dataset et sélectionnez le même dataset qui se connecte au répéteur, à la galerie ou au tableau. 
  7. Cliquez sur le menu déroulant L'action de cliquer connecte à et sélectionnez Appliquer les filtres
  1. Cliquez sur le bouton et sélectionnez l'icône Design  pour personnaliser l'apparence de votre bouton « Appliquer les filtres ».
  2. Cliquez sur Aperçu pour tester votre bouton « Appliquer les filtres ».
  3. Cliquez sur Publier si vous êtes prêt à mettre en ligne les modifications. 

(Facultatif) Étape 4 | Ajouter un bouton de réinitialisation

Vous pouvez créer un bouton de réinitialisation sur lequel les visiteurs cliquent pour réinitialiser tous les filtres d'éléments de saisie qu'ils ont sélectionnés. Cela permet aux visiteurs de recommencer et de filtrer le contenu sans avoir à rafraîchir la page. 
Éditeur Wix
Éditeur Studio
  1. Cliquez sur Ajouter des éléments  sur le côté gauche de l'Éditeur.
  2. Cliquez sur Bouton.
  3. Cliquez et faites glisser le bouton que vous souhaitez utiliser comme bouton de réinitialisation sur la page. Vous pouvez utiliser n'importe lequel des types de boutons suivants : boutons assortis, boutons texte et icône ,  boutons icône, ou boutons image.
    Suggestion : Vous pouvez également ajouter une image et l'utiliser comme bouton de réinitialisation. 
  4. Cliquez sur Modifier le texte et saisissez le texte que vous souhaitez afficher sur le bouton (ex. « Réinitialiser les filtres »). 
  5. Cliquez sur l'icône Connecter au CMS .
  6. Cliquez sur le menu déroulant Choisir un dataset et sélectionnez le même dataset qui se connecte au répéteur, à la galerie ou au tableau. 
  7. Cliquez sur le menu déroulant L'action de cliquer connecte à et sélectionnez Réinitialiser les valeurs de saisie
Une capture d'écran de la sélection du
  1. Cliquez sur le bouton et sélectionnez l'icône Design  pour personnaliser l'apparence de votre bouton de réinitialisation.
  2. Cliquez sur Aperçu pour tester votre bouton de réinitialisation.
  3. Cliquez sur Publier si vous êtes prêt à mettre en ligne les modifications. 

FAQ

Cliquez ci-dessous pour obtenir des réponses aux questions les plus courantes sur l'utilisation d'éléments de saisie pour filtrer le contenu. 

Cela vous a-t-il aidé ?

|