Easy-Micro

LOGICIEL WordPress
Formulaire WordPress

Réaliser un formulaire dans WordPress

wordPress Comment créer un formulaire de contact dans WordPress?

Vous l'avez sans nul doute remarqué, WordPress est livré sans formulaire de contact.
Il faut donc télécharger une extension gratuite comme Contact form 7.

- Soit à télécharger dans le dossier "/wp-content/plugins/" puis aller dans le menu du tableau de bord "Extensions/Plugins".

- Soit directement dans le menu "Extensions" en saisissant dans la barre de recherche 'Contact form 7'.

Notez que l'ajout du formulaire dans une page WordPress ou un article se fera par l'ajout d'un "shortcode", délivré lors de la création du formulaire lui-même :

[contact-form-7 id="65" title="Formulaire de contact 1"]

Plus d'infos sur WordPress.fr

Attention: Si vous êtes hébergé chez 1&1 IONOS, votre mail de Contact Form 7 ne fonctionnera pas! Pour pouvoir se servir de la fonction mail avec l'extension Contact Form 7 chez IONOS 1&1, il faut avoir configuré un email dans l'espace client IONOS 1&1
Voici la procédure :
  1. Dans l'espace client, cliquez sur "Configurer les adresses e-mail"
  2. Cliquez ensuite sur "E-mail Basic"
  3. Créer enfin une nouvelle adresse e-mail (Exemple : monprenom@monsite.com) avec une redirection vers votre adresse classique
C'est cette nouvelle adresse qui doit être utilisée dans le formulaire Contact Form 7 de WordPress

wordPress Comment transformer le style du formulaire ContactForm7 dans WordPress?

On utilise un CSS additionnel (menu du tableau de bord : Apparence > Thèmes > Personnaliser) comme celui-ci :
/* Style sur le fond et les bordures du formulaire */
div.wpcf7 { 
background-color: #fbefde;
border: 1px solid #f28f27;
}

/* Style sur les textes du formulaire */
.wpcf7 legend {
color:#fff;
font-family:lora, sans-serif; 
}

/* Style sur les champs du formulaire */
.wpcf7 input[type="text"], 
.wpcf7 input[type="email"],
.wpcf7 textarea {
background:#725f4c;   
}

/* Style sur les boutons du formulaire */
.wpcf7 input[type="submit"], 
.wpcf7 input[type="button"] { 
background-color:#725f4c;
width:100%;
text-align:center;
}

wordPress Formulaire WordPress avec stockage dans une base de données

On utilise l'extension (plug-in) CFDB : Contact Form DB

Attention, cette extension nécessite l'installation préalable de l'extension Contact Form 7

Pour fonctionner, il faut remplir au moins 1 formulaire
Dans le menu Short Code, on sélectionne notre formulaire (Formulaire de contact 1) et
- on peut exporter la table vers un fichier Excel CSV
- réaliser un short code d'affichage (cfdb-Values ou cfdb_Table) dans une nouvelle page. Exemple :

[cfdb-table form="Formulaire de contact 1" hide="Submitted,submit_time" headers="your-name=Votre nom"]

Note : attention à la case des noms des champs!



< Page précédente WORDPRESS Page suivante >