romy.tetue.net

Développement front et conception web
X-HTML, CSS, SPIP, sémantique et accessibilité


Une page de contact dans mon SPIP

21 avril 2011,
par Romy Têtue


Comment afficher simplement un formulaire de contact dans un site SPIP ? Facile, puisqu’il y en a autant que d’auteurs !

Beaucoup cherchent comment ajouter une « page contact » à leur site SPIP, avec un formulaire dédié, en installant des plugins pour ce faire... sans savoir que c’est déjà possible, dans SPIP, naturellement.

Y’a autant de formulaires de contact que d’auteurs !

Pour comprendre, reprenons depuis le début... À la première installation de SPIP, un premier compte utilisateur est créé, celui du « webmestre », qui est l’auteur numéro 1. Vérifiez que son adresse email est renseignée et qu’il est auteur d’au moins un article publié [*], puis rendez-vous sur le site public, à la page de cet auteur (en ajoutant « /?auteur1 » après le nom de domaine) : cette page affiche un formulaire qui permet d’écrire à l’auteur. Le voilà votre formulaire de contact !

PNG - 14.9 ko
Formulaire de contact de SPIP

De même, chaque nouvel auteur dont l’adresse courriel est renseignée [*], dispose d’un formulaire personnel, qui permet de le contacter sans divulguer son adresse. C’est ainsi dans SPIP, par défaut. Il n’y a effectivement pas un formulaire de contact, mais autant de formulaires de contact que d’auteurs.

Ce n’est pas exactement ce que nous cherchons, mais cela révèle que le mécanisme est présent dans SPIP, nativement, sans qu’il soit nécessaire d’ajouter quoique ce soit. À partir de là, il ne faut plus grand chose, comme nous allons le voir, pour réaliser une page contact. Un peu d’astuce, d’espièglerie...

Transformer un auteur en page « contact »

Voici la méthode la plus simple, qui utilise le squelette auteur.html de la distribution de SPIP.

  1. Créez un utilisateur dédié, appelé « Contact », par exemple l’auteur n°1
  2. N’oubliez pas de renseigner son adresse email [*]
  3. Vous pouvez utiliser le champ « bio » pour donner d’autres informations de contact, comme par exemple l’adresse postale
  4. Pour que l’auteur existe en tant que tel, attribuez-lui un article publié [*]
  5. Affichez la page ?auteur1 pour vérifier que tout fonctionne
  6. Faites un lien vers cette page, depuis votre barre de navigation ou dans le pied de page, en ajoutant cette ligne à l’endroit voulu de vos squelettes :
    <a href="#URL_AUTEUR{1}">Contact</a>
    ou mieux :
    <BOUCLE_contact(AUTEURS){id_auteur=1}><a href="#URL_AUTEUR">#NOM</a></BOUCLE_contact>

C’est tout !

Transformer un article en page « contact »

Cette seconde méthode est moins évidente, mais néanmoins aussi facile que la précédente. Elle repose sur le fonctionnement spécifique du formulaire SPIP.

SPIP est distribué avec plusieurs formulaires prêts à l’emploi. Vous aviez spontanément et désespérément cherché la balise « #FORMULAIRE_CONTACT », mais il faut le savoir, c’est le tag « #FORMULAIRE_ECRIRE_AUTEUR » qui fabrique et affiche ce formulaire. Cette balise est un peu magique : elle fonctionne dans une boucle AUTEURS, évidemment, mais aussi dans les boucles ARTICLES, entre autres. Comme le dit la doc en ligne sur les formulaires SPIP : placé dans une boucle ARTICLES, ce formulaire permet d’envoyer un mail à tous les auteurs de cet article, sans autre forme de prise de tête. Ça ouvre des perspectives intéressantes, en permettant notamment de contacter plusieurs personnes d’un coup, façon mailing list !

  1. Créez un article intitulé « Contact » ou « Écrivez-nous », par exemple le n°7. Vous pouvez utiliser les champs pour afficher d’autres informations de contact, comme l’adresse postale, etc.
  2. Associez à cet article le (ou les) auteur(s) à contacter
  3. Ajoutez simplement la balise #FORMULAIRE_ECRIRE_AUTEUR dans votre squelette article.html. Pour que ce formulaire ne s’affiche pas dans tous les articles, mais seulement dans celui-ci, conditionnez sa présence ainsi :
    [(#ID_ARTICLE|=={7}|oui)#FORMULAIRE_ECRIRE_AUTEUR]
  4. N’oubliez pas de publier l’article ! Il est consultable à l’adresse URL ?article7 : vérifiez son bon fonctionnement.
  5. Pour finir, faites un lien vers cette page, en ajoutant cette ligne à l’endroit voulu de vos squelettes :
    <a href="#URL_ARTICLE{7}">Contact</a>
    ou mieux :
    <BOUCLE_contact(ARTICLES){id_article=7}><a href="#URL_ARTICLE">#TITRE</a></BOUCLE_contact>
PNG - 80.8 ko
Ma page contact

Je préfère utiliser un article pour fabriquer la page de contact, afin de pouvoir le ranger dans une rubrique et l’afficher dans l’arborescence du site, en bénéficiant de la jolie ré-écriture d’URL des articles et surtout pour pouvoir le dépublier facilement si besoin était — bref, pouvoir le manipuler comme n’importe quelle autre page du site, juste depuis l’espace privé.

- Mieux : un modèle prêt à l’emploi

On rêverait pouvoir tout faire depuis l’espace privé, sans devoir toucher aux squelettes du site, en insérant par exemple <formulaire_ecrire_auteur> dans le champ d’un article... Ce n’est malheureusement pas possible. Mais il suffit de fabriquer une noisette pour cela :

  1. Dans le sous-repertoire /modèles de votre dossier « squelettes », créez un fichier formulaire_contact.html contenant notre balise magique dans une boucle, nécessairement :
    <BOUCLE_article(ARTICLES){id_article}>#FORMULAIRE_ECRIRE_AUTEUR</BOUCLE_article>
  2. Vous pouvez ensuite utiliser ce formulaire dans n’importe quel article, en saisissant <formulaire_contact|id_article=7>, sans oublier de passer l’identifiant en paramètre.

Cette noisette est distribuée dans ma trousse (qui fait aussi plein d’autres choses astucieuses et bien pratiques — ou pas). C’est la méthode que j’emploie sur tous mes sites, parce que codée une bonne fois pour toutes. Mais nous sommes d’accord, ce n’est qu’une rustine, en attendant la distribution d’un joli <form|contact> prêt à l’emploi.

Créer un squelette « contact » dédié

  1. Il s’agit de créer un squelette dédié, contact.html, contenant la balise #FORMULAIRE_ECRIRE_AUTEUR dans une boucle AUTEURS (ou ARTICLES, selon l’une des deux approches exposées précédemment)
  2. Cette page est consultable à l’adresse URL ?page=contact
  3. Voici comment la lier dans les squelettes :
    <a href="#URL_PAGE{contact}">Contact</a>

Cette troisième méthode n’est pas la plus simple et est moins avantageuse que les précédentes, car cette page n’est pas un objet éditorial de SPIP : c’est un fichier quasi statique, qu’on ne peut donc pas « dépublier » facilement depuis l’espace privé, qui, de même, n’est pas facilement éditable, et qui ne bénéficie pas de la réécriture d’URL en vigueur sur le site, etc. Bref, c’est pas pratique.


Il ne reste plus qu’à ajouter un skin CSS prêt à l’emploi ou de vous inspirer de ceux-ci : Beautiful Contact Forms for your Inspiration pour habiller joliment votre formulaire.

Mais nous sommes d’accord : ce serait mieux si telle page existait par défaut. Ça pourrait être une bête ?page=contact, avec un #FORMULAIRE_ECRIRE_AUTEUR mieux nommé #FORMULAIRE_CONTACT qui, placé hors boucle, enverrait par défaut à l’auteur 1 (ou même à « l’adresse e-mail du webmestre » renseignée dans la configuration du site et dont j’ignore quelle est l’utilité si elle ne sert pas à ça).

Pour des besoins plus évolués (champs supplémentaires, stockage en base, etc.), orientez-vous vers les plugins dédiés, comme le très bon « Formulaire de Contact Avancé »... qui tient en 1125 fichiers ! Mais... avez-vous vraiment besoin de tout ça ?


[*] Pour que ce formulaire fonctionne, il faut :

  • ne pas oublier de renseigner l’adresse courriel de l’auteur, c’est évident, mais ça va mieux en le disant ;
  • que l’auteur ait au moins un article publié ;
  • et que le serveur hébergeant le site accepte d’envoyer des mails.

(Publicité)

Voter pour cet artice sur hellocoton.fr Netvibes Del.ico.us

Vos commentaires

  • Le 21 avril 2011 à 10:22, par Nicolas Hoizey Gravatar En réponse à : Une page de contact dans mon SPIP

    J’ajouterais qu’il est possible d’utiliser le mécanisme de forums aussi, ça permet d’avoir une trace des messages sans rien coder ni aucun plugin...

  • Le 21 avril 2011 à 10:37, par Jacques Pyrat Gravatar En réponse à : Une page de contact dans mon SPIP

    En utilisant le critère {tous} dans la boucle, cela permet aussi d’afficher le formulaire de contact pour les auteurs sans article publié ;-)

  • Le 22 avril 2011 à 08:51, par denisb Gravatar En réponse à : Une page de contact dans mon SPIP

    le très bon « Formulaire de Contact Avancé »... qui tient en 1125 fichiers ! Mais... avez-vous vraiment besoin de tout ça ?


    perso, je n’en compte qu’une soixantaine (à rapprocher de la cinquantaine de "la trousse à Têtue 2").

    l’un des intérêts principaux de "formulaire de contact avancé" étant de conserver en base de données tous les messages adressés par son entremise.

  • Le 22 avril 2011 à 10:01, par Romy Têtue Gravatar En réponse à : Une page de contact dans mon SPIP

    @denisb : tu oublies les dépendances !!! Je viens de mettre à jour ce plugin de contact sur un petit site et c’est la longueur de l’opération qui a attiré mon attention sur le nombre de fichiers... Waouh ! Au final ma trousse fait plus de choses, en moins de fichiers ;) Mais on s’en fiche : ce n’est pas le nombre qui compte, mais l’adéquation au besoin.

  • Le 27 avril 2011 à 19:47, par b_b Gravatar En réponse à : Une page de contact dans mon SPIP

    Plop Romy, j’avais en stock un petit plugin pour pallier à ce manque de SPIP. Ton article m’a fait penser qu’il serait peut être utile de le partager. Le voici donc sur SPIP contrib :

    http://www.spip-contrib.net/Formulaire-de-contact-libre

    Bises ++

  • Le 30 avril 2011 à 12:04, par wlid Gravatar En réponse à : Une page de contact dans mon SPIP

    cela permet aussi d’afficher le formulaire de contact pour les auteurs sans article publié ...

  • Le 20 mai 2011 à 00:42, par Isabelle Saillot Gravatar En réponse à : Une page de contact dans mon SPIP

    Bonjour,
    merci pour ce tuto. J’ai opté pour la formule simple de créer un article « Contact » (N°23), j’ai mis la condition dans article.html et inséré la boucle auteur là où il fallait, dans les onglet de navigation tout en haut. Résultat il affiche bien le formulaire..... mais toute la page d’accueil en dessous ! comment faire pour afficher le formu dans une page vierge ?
    MERCI D’AVANCE !
    Isabelle

  • Le 20 mai 2011 à 01:02, par Isabelle Saillot Gravatar En réponse à : Une page de contact dans mon SPIP

    Rebonjour,
    j’ai trouvé l’erreur !! (j’avais mal positionné ma balise #FORMULAIRE_ECRIRE_AUTEUR
    Maintenant autre pb : le texte ne s’affiche pas à côté des boîtes..... « votre adresse mail » s’affiche à côté de « Sujet » et après il y a 2 boîtes juxtaposées..... Si vous pouvez m’indiquer une piste...
    MERCI
    Isabelle

  • Le 26 octobre 2011 à 07:45, par immobilier neuf Gravatar En réponse à : Une page de contact dans mon SPIP

    Serait-il possible d’afficher un formulaire de contact en bas de chaque article avec spip ? Y aurait-il un plugin spécial pour cela ? Si cela était possible avec spip, je changerai mon fusil d’épaule. Bien à vous

  • Le 12 décembre 2011 à 10:03, par paul Gravatar En réponse à : Une page de contact dans mon SPIP

    Merci pour cet article. La formulaire s’affiche bien sur mes pages auteurs mais impossible de le recevoir. Est-ce que cela peut venir de SPIP ou uniquement du serveur e-mail de mon site ? Je suis chez OVH. Merci

    Mutuelle


    La mutuelle santé assure toujours un bon résultat. La complémentaire santé dite aussi mutuelle permet de diminuer le prix sur sa formation mutuelle.

  • Le 25 février à 23:28, par tounse Gravatar En réponse à : Une page de contact dans mon SPIP

    bonjour
    comment modifier les champs du formulaire dans la seconde méthode
    merci
    tounse

  • Le 25 février à 23:30, par tounse Gravatar En réponse à : Une page de contact dans mon SPIP

    de plus, ps : j’ai mis l’article contact dans la rubrique contact et j’ai donc 2 contact dans mon menu, comment résoudre cela ?
    merci
    tounse

  • Le 18 mars à 01:08, par Matias Grenn Gravatar En réponse à : Une page de contact dans mon SPIP

    Je suis heureux de lire ce que je dis à tue tête à tous ceux qui m’installent « tables & forms » pour ne faire qu’un formulaire de contact : si on apprend à utiliser les boucles et les fonctionnalités de base de SPIP, on rèpond à une grande partie des besoins. J’utilise des plugins, oui, mais l’objectif est d’en utiliser le moins possible.

Un message, un commentaire ?


Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d'abord sur gravatar.com (gratuit et indolore) et n'oubliez pas d'indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici
  • Ce formulaire accepte les raccourcis SPIP [->url] {{gras}} {italique} <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Suivre les commentaires : RSS 2.0 | Atom