Un formulaire de contact pour son blog

Depuis la création du Bog de Lise, j’utilisais, comme formulaire de contact Dagon Design Form Mailer. Ce plugin tout simple fonctionnait bien, à ceci près que les messages reçus ne prenaient pas bien en compte les caractères accentués.

Curieusement, bien que les fichiers de traduction soient bien installés, sur un nouveau blog que je viens de créer, l’affichage du formulaire de contact restait en anglais. Je suis donc partie à la recherche d’un nouveau formulaire de contact ; le blog de Fran6art proposait notamment cforms. Je l’ai testé mais l’ai trouvé trop compliqué.

Sur le site de WordPress, j’ai trouvé un plugin plus simple que le précédent, à peu près traduit en français, mais très configurable, Fast Secure Contact Form ; il permet de spécifier les champs requis, de créer de nouveaux champs, modifier l’apparence,… Il dispose d’une captcha, qui fonctionne sur Le Blog de Lise, mais pas sur l’autre blog, alors que les deux sont hébergés au même endroit !

On remarque sur les dernières images qu’une adresse mail « bidon » fonctionne !

Installation de Fast Secure Contact Form

Comme tous les plugins, après l’avoir téléchargé et décompressé, il faut télécharger le répertoire si-contact-form dans le répertoire wp-content.

Ensuite, il faut comme toutes les extensions, l’activer depuis le panneau d’administration du blog, puis depuis cette page, cliquer sur le lien « Paramètres ».

On arrive alors sur la page de configuration.

Configuration

On peut également accéder à la page de configuration depuis Extension > FS Contact Form Option.

Ce plugin permet de configurer plusieurs formulaires. Chaque formulaire est alors numéroté ; pour afficher le formulaire dans une page, il faut saisir le code :

[si-contact-form form='x']

le numéro x étant celui du formulaire.

Pour la plupart des paramètres, un texte d’aide est accessible en cliquant sur le lien « aide ».

On peut saisir un texte d’introduction qui s’affichera avant le formulaire de contact. On peut laisser ce champ vide.

Les champs suivants parlent d’eux-mêmes :

  • destinataire du message envoyé par les lecteurs (plusieurs destinataires peuvent être indiqués),
  • réponse automatique dès réception d’un message,
  • utilisation d’Akismet pour prévenir le spam,
  • captcha : ce formulaire dispose de fichiers d’aide très bien faits,

La configuration des champs du formulaire

Il est possible de modifier les paramètres par défaut et ne pas rendre certains champs obligatoires. On peut créer des champs supplémentaires, en indiquant d’une part le type de champ, d’autre part, si ce champ devra être obligatoirement saisi ou non.

Redirection

Par défaut, la redirection est activée : une fois le message saisi et envoyé par le lecteur, celui-ci est redirigé vers la page d’accueil du blog ; on peut désactiver cette option.

L’apparence du formulaire

La première ligne

CSS style for form DIV on the contact form:

permet d’indiquer la largeur totale du formulaire.

La deuxième ligne

CSS style for border on the contact form:

permet d’indiquer notamment la couleur du cadre (color) du formulaire et l’espace entre le cadre et le formulaire (padding), la largeur totale du formulaire.

La troisième ligne

CSS style for required field text on the contact form:

permet d’indiquer la couleur de la police qu’utilisera le lecteur pour remplir les champs du formulaire.

La cinquième ligne

Style CSS pour les titres des champs du formulaire:

permet notamment d’indiquer l’espacement des titres du formulaire, mais la couleur des titres n’est pas modifiée.

La sixième ligne

Style CSS pour les champs du formulaire:

permet de modifier la couleur du fond des champs de saisie et celle de la police utilisée.

La huitième ligne

Style CSS pour les erreurs de saisies du formulaire:

permet de modifier la couleur d’affichage du message d’erreur en cas de saisie incomplète des champs requis.

Les dixième et onzième lignes

Style CSS pour le DIV du petit CAPTCHA:

et

Style CSS pour le DIV du petit CAPTCHA:

permettent d’indiquer la taille des captchas.

La ligne

Taille du champ de texte:

permet d’indiquer la largeur des champs de saisie (nom, adresse mail, sujet,…).

La ligne

Nombre de colonnes de la boîte texte:

permet de préciser la largeur du champ du message.

Les champs requis

Le formulaire Champs permet de spécifier le message qui sera affiché pour indiquer les champs obligatoires ; il permet d’activer ou pas la fonction « champ requis ».

Ne pas oublier de cliquer sur le bouton « Mettre à jour les options » pour enregistrer les modifications.


Ecrit par Lise - Site

15 commentaires pour “Un formulaire de contact pour son blog

  1. Bonjour,
    Bizarre que ce plugin ne fonctionne pas sur ton autre blog … j’ai eu l’occasion récemment de l’installer sur plusieurs WordPress, et tout était opérationnel.
    N’aurais-tu pas un plugin qui casse la requête du captcha d’installé par hasard?

    • Moi non plus, je n’aime pas les captchas ! je les trouve moches et parfois peu lisibles. Mais elles, comme les opérations mathématiques, ont l’avantage de ne pas être pas être « comprises » des robots, et limitent de ce fait les commentaires à filtrer.

  2. Bonjour,

    dans Fast Secure Contact Form je n’arrive pas à mettre un sujet de message par défaut, ou tout simplement je ne sait pas comment faire j’ai supprimé la case à remplir sujet et celle du message et je voudrai avoir un titre quand je reçois un email. J’espère que j’ai été clair.
    Merci d’avance pour vos réponses

    • Si je comprends bien la question, il s’agit que les messages reçus disposent d’un titre afin de les identifier.
      Dans la section « Destinataires », il faut saisir le sujet du message à la ligne « Préfixe à ajouter au sujet: »

      • Bonjour,

        oui c’est tout à fait ça, merci.
        PS: Si quelqu’un sait ou trouver des tutoriels pour embellir le formulaire ou une aide en fr je suis preneur

  3. Bonjour, j’ai installé Fast Secure Contact Form, tout va bien sauf les mails que je ne reçois pas et j’ai essayé différents mails. Es-ce que vous savez comment faire?

    J’ai installé avant celà, le formulaire Cforms et aussi Contact from 7 et j’ai le même soucis =/

    • Dans les options, dans la liste de destinataires, vus avez bien saisi l’adresse mail vers laquelle les messages doivent être envoyés ?

      Si vous avez ce souci avec les autres formulaires de contact, peut-être votre hébergeur ne supporte-t-il pas la réception de mails ?

      Avez-vous essayé en cochant les cases
      Custom E-mail From (optional):
      Enable when web host requires « Mail From » strictly tied to domain email account.

      Avez-vous essayé en désactivant le captcha ?

  4. Bah je suis juste en localhost pour le moment, l’hébergement c’est pas moi qui m’en occupe, car je suis en stage.

    • je suis juste en localhost pour le moment,

      C’est pour cela que vous ne pouvez recevoir de mail 😉 Localhost, cela signifie que le serveur n’est pas sur Internet, les mails ne peuvent donc pas être réceptionnés.

  5. Ok , je pensais que le test aurait marché meme si c’était en localhost, j’espère que sa fonctionnera quand il sera hébergé alors ^^
    En tout cas Merci =)

  6. Bonjour,

    J’aimerai savoir si cela est possible de mettre des champs sur 2 ou 3 colonnes ?, afin d’éviter d’avoir une liste qui donne l’impression d’être très longue, donc peu engageante à remplir.

    Merci par avance pour votre aide.

    Cordialement

  7. Désolée pour ma réponse tardive, mais avec mon déménagement, je n’ai pas trop suivi le blog !
    A priori je ne crois pas, sauf à modifier le code du plugin ; il n’existe pas de configuration simple pour disposer les champs en colonnes.

Les commentaires sont clos.