Système de gestion de contenu (CMS) : Afficher le contenu de la collection sur une page normale

Temps de lecture : 7 min
Dans ce tutoriel, vous apprendrez à créer une page personnalisée pour afficher le contenu d'une collection. Nous vous montrerons comment mettre en page des éléments de page, créer une collection et la connecter à ces éléments à l'aide d'un ensemble de données. Enfin, nous testerons la page en mode Aperçu et publierons le site pour que les visiteurs de votre site puissent voir vos données.
Remarque :
Dans ce tutoriel, nous créons une page statique pour afficher le contenu d'une collection. Vous pouvez également configurer des pages d'éléments dynamiques qui créent automatiquement des pages pour chaque élément de votre collection. 

Étape 1 | Créer une collection

Une collection est l'endroit où vous stockez le contenu dont vous avez besoin pour votre site, ou où vous collectez les informations soumises par vos visiteurs. Lorsque vous créez une collection, vous devez également définir ses autorisations. Elles vous permettent de contrôler ce que vos visiteurs peuvent faire avec le contenu de votre collection. Ici, nous ajoutons une collection vide qui stockera le contenu que vous souhaitez afficher aux visiteurs.

Pour créer une collection :

  1. Accédez au Système de gestion de contenu (CMS) dans le tableau de bord de votre site.
  2. Cliquez sur Créer une catégorie.
  3. Saisissez un nom pour votre collection.
  4. Choisissez le nombre d'éléments que vous voulez dans votre collection :
    • Un seul élément : Une collection peut avoir un seul élément contenant plusieurs champs, tels que du texte, des images, des vidéos et des URL. Ce type est mieux adapté au contenu non répétable, tel qu'une page "à propos".
    • Éléments multiples (par défaut) : Une collection de plusieurs éléments stocke beaucoup plus de contenu, et il peut apparaître dans un élément tel qu'un répéteur ou un tableau. Ce type convient aux listes de propriétés, aux portfolios, aux recettes, etc. Vous pouvez en savoir plus sur la différence entre les collections avec un seul élément et plusieurs éléments.
  5. Cliquez sur Créer .

Étape 2 | Configurer votre collection

Ajoutez un champ pour chaque information que vous souhaitez que vos visiteurs voient, puis saisissez le contenu.

Pour configurer votre collection :

  1. Accédez au Système de gestion de contenu (CMS) dans le tableau de bord de votre site.
  2. Cliquez sur la catégorie concernée.
  3. Cliquez sur Gérer les champs, puis sur + Ajouter un champ pour ajouter un champ à votre collection. 
  4. Configurez le champ pour qu'il corresponde aux informations que vous souhaitez que vos visiteurs voient. Assurez-vous de sélectionner le type de champ approprié pour qu'il corresponde au contenu de votre champ.
  5. Définissez le champ de chacun des éléments de votre page planifiée.
  6. Saisissez du contenu dans votre collection.

Étape 3 | Personnaliser le design de votre page

Votre page doit inclure des éléments qui permettent aux visiteurs de voir les informations que vous souhaitez afficher.

Pour commencer :

  1. Allez dans le menu Ajouter des éléments et sélectionnez le groupe qui contient un type d'élément qui correspond à un type de champ de votre collection.
  2. Faites glisser des éléments sur votre page pour concevoir le design et la mis en page votre page. Vous pouvez faire votre choix parmi des éléments tels que le texte et l'image.

Étape 4 | Configurer vos éléments

Une fois que vous avez ajouté des éléments de page, vous pouvez configurer l'apparence de chaque élément dans son panneau Paramètres.

Pour configurer vos éléments :

  1. Sélectionnez un élément de page, cliquez sur l'icône Paramètres et utilisez les options pour le configurer.
  2. Répétez cette opération pour chacun des éléments de votre page.
Vous devez maintenant connecter vos éléments à votre collection. Pour ce faire, nous utiliserons un ensemble de données, que nous verrons dans les prochaines étapes.

Étape 5 | Ajouter et configurer un ensemble de données

Un ensemble de données relie vos éléments à votre collection. Lorsque vous ajoutez un ensemble de données, vous devez décider à quelle collection vous souhaitez vous connecter, si vous souhaitez que vos visiteurs puissent lire et/ou écrire dans votre collection, et plus encore.

Pour ajouter un ensemble de données à votre page :

  1. Accédez au système de gestion de contenu (CMS) dans votre Éditeur :
    • Éditeur Wix : Cliquer sur CM2  à gauche de l'Éditeur.
    • Editor X : Cliquer sur le système de gestion de contenu ( SMS ) en haut de l'Editor X.
  2. Cliquez sur Ajouter des éléments de contenu.
  3. Cliquez sur Dataset. Un ensemble de données est ajouté à votre page.
  4. Sélectionnez le dataset et cliquez sur Paramètres. Le panneau Paramètres de l'ensemble de données s'ouvre.
  5. Sous Connecter une collection, sélectionnez votre collecte.
  6. Sélectionnez Read-only pour le Mode.
  7. Si vous le souhaitez, vous pouvez définir le filtrage et le tri pour l'ensemble de données.
  8. Fermez le panneau.

Étape 6 | Connecter les éléments de votre page

Une fois votre ensemble de données configuré, vous pouvez lui connecter vos éléments. Vous devez vous rendre à chacun des éléments de votre page et le connecter au même ensemble de données. Chaque fois que vous connectez un élément, vous définissez également à quel champ de votre collection sa valeur doit se connecter. Certains éléments contiennent plus d'une propriété qui peuvent être connectées à différents champs.

Pour connecter vos éléments :

  1. Sélectionnez un élément et cliquez sur son bouton Connecter aux données .
  2. Sélectionnez la zone de votre collection dans laquelle les informations sont stockées.
  3. Répétez cette opération pour chacun des éléments de votre page.
À l'étape suivante, nous créerons des boutons Précédent et Suivant pour parcourir les éléments du dataset.

Étape 7 | Créer des boutons « Précédent » et « Suivant »

Maintenant que tous vos éléments sont connectés à la même collection via le même ensemble de données, vous devez permettre à vos visiteurs de naviguer dans les informations. Pour ce faire, ajoutez deux boutons à votre page, connectez-les au même dataset que les autres éléments et définissez leurs actions par clic.

Pour créer des boutons Précédent et Suivant :

  1. Ajoutez deux boutons à votre page et changez leur texte en Précédent et Suivant.
  2. Cliquez sur leurs boutons Connecter aux données .
  3. Dans le panneau Connecter bouton, sélectionnez votre dataset.
  4. Sous L' action du clic est connectée à, sélectionnez Élément précédent pour le premier bouton et Élément suivant pour le deuxième bouton.

Étape 8 | Tester votre page

Vous pouvez désormais tester votre page en mode Aperçu . Le contenu que vous consulterez proviendra de votre base de données Sandbox, qui n'est visible qu'en mode Aperçu. En savoir plus sur l'environnement Sandbox.

Pour tester votre page :

  1. Cliquez sur Aperçu.
  2. Cliquez sur les boutons Suivant et Précédent.
  3. Cliquez sur Retour à l'Éditeur .

Étape 9 | Publier votre site

Remarque :
Cette étape s'applique uniquement lorsque l'Environnement de test (Sandbox) est activé. En savoir plus sur l'environnement Sandbox.
Il est maintenant temps de publier votre site afin que vos visiteurs puissent voir votre contenu.

La publication de votre site crée une version vide de votre collection avec tous les champs de votre collection Sandbox. Le contenu que vos visiteurs verront dans la version publiée de votre site est enregistré dans votre collection Live, à laquelle vous pouvez accéder via le gestionnaire de contenu. 

Une fois que vous avez publié votre site pour créer une collection Live, vous pouvez ajouter les données à la collection Live manuellement ou synchroniser le contenu de votre collection Sandbox.

Pour configurer une collection en ligne :

  1. Dans l'Éditeur, cliquez sur Publier pour publier votre site.
  2. Accédez au système de gestion de contenu (CMS) dans votre Éditeur :
    • Éditeur Wix : Cliquer sur CM2  à gauche de l'Éditeur.
    • Editor X : Cliquer sur le système de gestion de contenu ( SMS ) en haut de l'Editor X.
  3. Cliquez sur collections.
  4. Sélectionnez la catégorie requise.
  5. Choisissez comment remplir votre collection Live :
    • Pour ajouter manuellement des données à votre collection Live :
      • Cliquez sur Collection Live et saisissez votre contenu.
    • Pour synchroniser le contenu de votre collection Sandbox :
      • Cliquez sur Collection Sandbox.
      • Cliquez sur Synchroniser le contenu
      • Sélectionnez l'option de synchronisation souhaitée.
      • Cliquez sur Synchroniser .
      • Cliquez à nouveau sur Synchroniser pour confirmer.

Étape 10 | Consulter votre contenu en ligne

Une fois que vous publiez votre site, votre contenu est disponible pour vos visiteurs. Lorsqu'ils visitent votre page, ils voient le contenu de votre collection Live.

Prochaines étapes :

Vous pouvez ajouter plus de fonctionnalités à votre page.

Cela vous a-t-il aidé ?

|