Tutoriel : Mettre en place un livre d'or avec Joomladform 1.4

Depuis la version 1.4 de Joomladform, il est possible d'afficher, par l'intermédiaire d'un lien de menu, une liste des soumissions correspondant au formulaire sélectionné.
Cette fonctionnalité peut avoir des usages multiples ; l'un d'entre eux est la réalisation d'un livre d'or où les utilisateurs vont venir déposer leur témoignage.

1. Création d'un formulaire

Avant toute chose, il faut bien sûr créer un formulaire.

Importation du formulaire de contact

Pour un livre d'or, nous aurons uniquement besoin des champs Nom, E-mail (pour permettre à l'auteur de recevoir une notification) et Témoignage ; nous allons donc pouvoir simplement importer le formulaire de contact de base, pour lequel il suffira d'apporter quelques petites modifications :

  • dépublier le champ « contact_subject » qui ne nous est pas utile
  • renommer le label « Message » du champ « contact_message » en « Témoignage » (ou tout autre texte qui convient mieux à votre cas de figure)
  • dans le label du champ « Consentement », remplacer « ma demande de contact » par « mon témoignage »
Configuration des champs du formulaire

Vous pouvez bien sûr également partir d'un nouveau formulaire, et ajouter les champs adéquats un par un.

2. Création d'un lien de menu

Après avoir renseigné quelques fois le formulaire pour ajouter des faux avis d'utilisateurs, nous allons maintenant créer un lien de menu pour afficher la liste des soumissions existantes.

Dans le lien de menu nouvellement créé, nous cliquons sur le bouton "Sélection", puis sur "Joomladform" et enfin "Soumissions". Au rechargement de la page, nous sélectionnons notre formulaire dans la liste déroulante "Formulaire". Il ne reste plus qu'à enregistrer le lien de menu.

Création d'un lien de menu

3. Modération des soumissions

Les soumissions de formulaire contiennent, depuis la version 1.4, un champ de publication. Celui-ci est par défaut sur « Dépublié », de manière à éviter l'apparition de spams ou de contenus inconvenants sur le site. Aucune soumission n’apparaît donc avant validation d'un admistrateur.

Pour publier une soumission, il faut se rendre dans Composants>Joomladform>Soumissions puis cliquer sur la croix de la colonne « Statut » de la ligne correspondante.

Publication des soumissions

Notez qu'il est possible d'utiliser la logique inverse en réglant dans la configuration du formulaire ou du composant le paramètre « Statut par défaut » sur « Publié ». Ainsi le modérateur n'aura qu'à supprimer ou dépublier les soumissions indésirables.

Paramètre de statut par défaut

4. Sélection des champs

Après publication, les témoignages apparaissent sur la page créée lors de l'étape 2. Cependant, à ce stade, l'affichage par défaut reprend tous les champs du formulaire, sans mise en forme spécifique. Si cette configuration pourrait convenir pour d'autres cas de figure, elle n'est pas adaptée pour l'affichage d'un livre d'or.
Pour obtenir un affichage adapté, nous allons retourner dans l'édition du lien de menu, et ouvrir l'onglet « Options Joomladform ». Nous allons ensuite sélectionner les données que nous souhaitons faire apparaître dans le paramètre « Champs à afficher » : Nom, Témoignage et Date.

Pour sélectionner le premier champ, commençons par cliquer sur le bouton vert "+". Nous allons saisir « contact_name » dans la colonne « Nom du champ », car c'est le nom de ce champ dans le formulaire de contact que nous avons importé. Nous laissons « Champ spécial » sur aucun (nous l'utiliserons plus tard), et « Titre du champ » vide, car nous souhaitons afficher le nom directement.Nous réglons donc le paramètre « Afficher le titre » sur « Non ». Enfin, nous aborderons les classes CSS au chapitre suivant.

Nous répétons ensuite l'opération pour le Témoignage, avec la valeur « contact_message » à la place de « contact_name ». Enfin, pour afficher la date, nous allons sélectionner « Date de la soumission » dans la colonne « Champ spécial ». Les champs spéciaux sont des informations enregistrées dans les soumissions de tous les formulaires, quels que soient les champs qui composent ces derniers.

Champs à afficher dans le livre d'or

5. Mise en forme du Livre d'Or

Nous voyons maintenant que seuls les champs que nous avons choisis s'affichent, mais ils apparaissent toujours de façon brute et uniforme.
Pour arranger cela, nous allons attribuer une classe CSS à chacun des champs.

Nous renseignons d'abord la colonne "Classe CSS" avec les valeurs suivantes : livre_nom, livre_avis et livre_date

Nous allons ensuite intégrer nos styles CSS dans un fichier appelé livredor.css, placé dans le répertoire media/com_joomladform/css/custom. Pour que cette feuille de style soit utilisée à l'affichage des soumissions, il faudra la sélectionner dans le paramètre « CSS personnalisé » du composant. Si un fichier CSS personnalisé est déjà utilisé, il suffira bien sûr d'intégrer les styles dans le fichier existant.

Sélection d'un fichier CSS

Voici un exemple de code CSS adapté aux champs et classes que nous avons créées :

joomladform .submission {
    background: #f0f0f0;
    padding: 0 10px 10px;
    margin: 20px 0;
}
.joomladform .submission .livre_nom {
    font-weight: bold;
}
.joomladform .submission .livre_date {
    text-align: right;
    font-size: 11px;
}

Une fois ces styles appliqués, la liste des soumissions prend l'apparence d'un livre d'or classique.

Apparence finale du livre d'or

Autres possibilités

Nous venons de voir comment mettre en place un livre d'or en quelques minutes grâce à Joomladform 1.4.

Les nouvelles fonctionnalités d'affichage des soumissions permettent bien d'autres usages, comme par exemple la publication d'observations relatives à une enquête publique.

Autre nouveauté notable de la version 1.4, Joomladform permet également d'intégrer la bibliothèque javascript chosen afin d'embellir les champs de sélection.

Commentaire 0

NOTE IMPORTANTE - Le support n'est pas assuré par le biais des commentaires. Si vous recherchez de l'assistance, merci dans un premier temps de consulter le forum dédié aux extensions puis au besoin de vous connecter sur le support en ligne où vos questions trouveront réponse généralement dans l'heure qui suit.

Merci pour votre compréhension.

Laissez un commentaire

Attention : Si vous disposez d'un compte utilisateur, veuillez vous connecter avant de poster un nouveau commentaire.