Material Design for Contact Form 7

Description

Les formulaires CF7 peuvent être aussi réactifs et interactifs qu’une app, il suffit d’y ajouter le thème « Material Design » de Google.

Style de Contact Form 7

Ce plugin apporte un tas de Short-codes qui vous permettront de dissimuler vos tags de formulaire CF7 et leur appliquer le thème material design.

Contact Form 7 + Material Design en action

Prenez 30 secondes et voyez à quoi pourrai ressembler votre formulaire de contact. Regardez la video ci-dessous: live demos.

Quoi de neuf dans la version 2.0 ?

  • Utilisation de la nouvelle Conception Matérielle. Les textes et champs de sélection peuvent maintenant être grisés ou contournés. Les aires de texte ont maintenant une étiquette interne. Voir les captures d’écran ci-dessous.
  • Nouveaux boutons: élevé (par défaut), sans élévation, et contourné.
  • Meilleure prise en charge des navigateurs IE11, iOS8+ ainsi que tous les navigateurs modernes.
  • La syntaxe de votre CSS personalisée est maintenant mise en évidence
  • Possibilité de choisir de continuer d’utiliser les styles classique si vous préférez

Contact Form 7 peut être plus interactif

Faites que votre formulaire réagisse aux entrées de l’utilisateur de manière plus intuitive. Les étiquettes de champs réagissent lorsque vous les survolez. Les cases et radios s’animent lorsque vous cliquez dessus.
Les bouttons « envoyez » incluent la conception materielle « ripple effect ».
Et bien plus encore !

Actuellement pris en charge:

  • Thème clair ou sombre
  • Entrée de texte (inclus texte, email, adresse web, numéro de téléphone, date) – variante grisée ou contournée
  • Aire de texte avec option de mise à la bonne taille automatique
  • Sélection/menu déroulant – variante « grisé » ou « contourné »
  • Cases
  • Radios
  • Acceptation
  • Champs upload de fichier
  • Bouton envoyer (incluant la roue de chargement)
  • Quiz
  • ReCaptcha
  • Autre (messages de validation …)

Version pro

  • Personnaliser couleurs et polices
  • Organiser les champs en colonnes
  • Change les radios et cases en switches
  • Ajouter les icônes principales au texte et sélectionner les champs
  • Grouper les champs en sections avec cards
  • Assistance mail directe

Vous pouvez passer à la version pro à tout moment sans quitter WordPress.

Fonctionne bien avec ces plugins:

  • Contact Form 7 Live Preview
  • Mailchimp pour WordPress
  • Champs obligatoires pour CF7
  • Formulaires CF7 en plusieurs étapes
  • Invisible reCaptcha for WordPress (but not CF7 Invisible reCaptcha)
  • Multifile Upload Field pour Contact Form 7 (support basique)

Formulaire de contact réactif

Material Design for Contact Form 7 est un thème de Contact Form 7 totalement ergonomique. Il s’adapte à la taille de votre écran et fonctionne sur tous les appareils.

Style de Contact Form

Material Design for Contact Form 7 applique les couleurs et polices Material Design par défaut, mais vous pouvez utiliser le WordPress Customizer pour changer les polices et couleurs à votre guise si vous êtes en version Pro.

Captures d’écran

  • Un simple formulaire
  • Formulaire simple, avec champs style "contourné"
  • Encore d'autres champs de formulaire, couleur personnalisée (fonctionnalité pro)
  • Exemple: thème Sombre
  • Générateur de Shortcode
  • Générateur de Shortcode

Installation

  1. Uploadez le zip dans le dossier /wp-content/plugins/ et décompressez le
  2. Activer le plugin depuis le menu « Plugins » dans WordPress

OU allez à « Plugins » puis « Add new » ou « Ajouter nouveau », et chercher « material design contact form 7 » pour l’installer depuis le tableau de bord WordPress

FAQ

Qu’est ce que Material Design ?

Material Design est un ensemble de lignes directrices, écrites par Google, qui souligne à quoi votre site internet ou app ressemble et se comporte. La plupart des apps Google utilisent Material Design, Android y compris.

Ai-je également besoin d’un thème Material Design ?

Pas du tout! Ce qui est bien avec Material Design, c’est que vous pouvez choisir d’en prendre autant que vous voulez. Vous pouvez très bien vous contenter d’avoir vos formulaires de contact personnalisés avec Material Design et pas le reste de votre site.

For more ways to add Material Design to your WordPress site (without changing your theme), see WordPress Material Design.

Comment utiliser ce plugin ?

Toute la documentation peut être trouvée en cliquant sur « aide » ou « help » en haut à droite de l’écran, puis « Material Design » depuis l’écran éditeur de formulaire du CF7.

Pour un tutoriel plus approfondi, voir How to apply Material Design to Contact Form 7.

Ca m’a l’air bien !

Certains thèmes ont des style qui écraseront le style Material Design. Si cela arrive, envoyez un lien vers votre formulaire de contact à support forum et je vous aiderai à réparer cela.

Avis

16 septembre 2019
I'm so glad to bought this application. I did a very stylish and professional form design with using material design according to my customers request. Also i tried this plugin with 3rd party cf7 plugins. that was successful working. I also asked help from support service and support service was really friendly and they solved my issue quickly. Thanks a lot 🙂
19 juin 2019
This plugin basically does everything you want it to do with your Contact Form 7 contact form. Responsive and nice to the eye. Even the free version makes the contact form look nice and professional without having to go out of your way to spend hours on writing css to make cf7 look good. 10/10 would install again.
Lire les 52 avis

Contributeurs & développeurs

« Material Design for Contact Form 7 » est un logiciel libre. Les personnes suivantes ont contribué à cette extension.

Contributeurs

“Material Design for Contact Form 7” a été traduit dans 8 locales. Remerciez l’équipe de traduction pour ses contributions.

Traduisez « Material Design for Contact Form 7 » dans votre langue.

Le développement vous intéresse ?

Parcourir le code, consulter le SVN dépôt, ou s’inscrire au journal de développement par RSS.

Journal

2.5.4

  • Mise à jour du SDK freemius
  • Fix for Safari datepickers sometimes being hidden behind other elements
  • Fix one of the nags which kept appearing after being closed

2.5.3

  • Adds CSS to remove duplicate dropdown arrows from select fields on some themes
  • Adds a fast option to download the latest pro version for existing license holders

2.5.2

  • Fixes a bug with include_blank in select fields

2.5.1

  • Updates to comply with the « Contact Form 7 » trademark policy

2.5.0

  • Allow exclusive checkboxes to be turned into switches
  • Fields now show invalid state after invalid form submission
  • A fix for avada theme selects

2.4.2

  • Fixed a bug with polyfilled dates in Safari

2.4.1

  • Fixed an upgrade bug
  • Added some CSS to combat some themes overriding our styles
  • Fixed terminology for switches

2.4.0

  • Exposed a JavaScript function to manually initialize the plugin scripts (for use on dynamically loaded forms).

2.3.5

  • Improve file field display
  • Activated max-width fix from 2.3.4

2.3.4

  • Added info about affiliate program in dashboard
  • Added a fix for some themes that set label’s max-width to 100%
  • Security improvements

2.3.2

  • Added translations! Russian, Japanese, French, German and Spanish

2.3.1

  • Update to allow translation of shortcode generator

2.3.0

  • Plugin rendu traduisible

2.2.2

  • Autoriser default:get pour les champs sélectionnés

2.2.1

  • Correctif concernant le problème de remplissage automatique des champs sélectionnés
  • Documents mis à jour pour fonctionner avec le dernier CF7

2.2.0

  • Modification des champs sélectionnés afin de ne plus utiliser SVG
  • Ajout d’icônes: fonctionnalité pro

2.1.6

  • Ajout d’un sélecteur de date polyfill

2.1.5

  • Quelques correctifs CSS pour les champs et libellés sous IOS

2.1.4

  • Correction sur l’espacement des colonnes sur les formulaires étroits

2.1.3

  • Correction d’une erreur de compatibilité PHP

2.1.2

  • Correctif d’un vieux bug des champs d’acception sous pré-CF7V5

2.1.1

  • Correction d’un bug sur la mise à niveau depuis le processus V1

2.1.0

  • Intégration de Contact Form 7 avec Multifile Upload Field

2.0.0

  • MISE À JOUR MAJEURE
  • Librairie de conception matérielle complètement nouvelle
  • Les champs de texte peuvent maintenant être soit contournés, soit grisés quand sélectionnés.
  • Nouveaux boutons: élevé (par défaut), sans élévation, et contourné.
  • Les aires de texte ont un une étiquette interne
  • Meilleure prise en charge du navigateur
  • Mise en évidence de la syntaxe personnalisée CSS

1.8.1

  • Correction de quelques bugs et une erreur qui apparaissait sous d’anciennes versions PHP

1.8.0

  • GRANDE NOUVELLE FONCTIONNALITE: Générateur de short-codes IU. Plus de création manuelle de short-codes en devant se référer à la documentation
  • Couleur de l’étiquette par défaut légèrement obscurcie ainsi que la bordure des champs d’entrée

1.7.7

  • Correction d’un problème créé par la version 1.7.6 sous certains systèmes

1.7.6

  • Mise à jour de l’intégration des short-codes afin qu’ils fonctionnent avec la nouvelle mise à jour de CF7 (Formulaire de Contact 7)

1.7.5

  • Correction d’une erreur PHP lorsqu’aucun style personnalisé n’a été choisit
  • Conformité avec la GDPR

1.7.4

  • Correction d’un bug qui vous obligez à fermer et ouvrir « use custom styles » avant que cela ne fonctionne

1.7.3

  • Correction d’un problème de check out

1.7.2

  • Diverses mises à jour

1.7.1

  • Erreurs Javascript corrigées dans la dernière version

1.7.0

  • Ajout de l’option « personnalisation » pour les couleurs de boutons
  • Possibilité de mettre les cases et radios dans des colonnes
  • Correction du message « les modification pourraient ne pas être enregistrées » sur les formulaires non modifiés
  • Possibilité de cacher le message Personnalisation Administrateur sur le front end
  • Correction du bouton « fermer » pour les publicité (version premium)
  • Mise à jour de l’API Freemius
  • Styles de champs de texte par défaut améliorés

1.6.2

  • Ajout d’un correctif pour les thèmes qui changent « envoyer » en un bouton

1.6.1

  • Ajout de l’intégration avec CF7 du plugin « Live Preview »

1.6.0

  • Ajout de plus d’options de personnalisation
  • Mise à jour du SDK Freemius
  • Ajout d’un short-code qui s’assure que les options de mise en page fonctionnent lorsqu’elles sont profondément imbriquées
  • Correctif d’un bug de sélection d’option sous firefox pour le thème Dark
  • Ajout de CSS pour rendre les thèmes moins susceptibles de remplacer les styles

1.5.18

  • Mise à jour du SDK Freemius, correction d’un bug concernant le staging/déploiement
  • Ajout d’un programme de parrainage – gain d’argent en partageant le plugin

1.5.17

  • Correction d’un bug avec les entrées de fichier dans les groupes de champs conditionnels

1.5.16

  • Correction d’un bug sous Safari: mise en page multi-colonne

1.5.15

  • Ajour d’un lien personnalisé pour les formulaires de front end

1.5.14

  • Possibilité d’intégrer d’autres plugins
  • Mise à jour de la documentation

1.5.13

  • Mise à jour du SDK freemius

1.5.12

  • Correction d’un bug concernant les champs obligatoires

1.5.11

  • Correction d’un bug concernant les valeurs par défaut des champs texte

1.5.10

  • Correction d’un bug concernant le champs quiz
  • Dequeue Roboto if not needed

1.5.9

  • Corrections de quelques bugs sous IE Edge

1.5.8

  • Correction du bug du champs de consentement

1.5.7

  • Correction d’un bug sélection de date sous iOS
  • Correction d’un conflit avec un thème WooThemes

1.5.6

  • Améliorer le style d’upload de fichier

1.5.5

  • Mettre à jour la hauteur minimum de la redimension automatique des aires de texte

1.5.4

  • Fonctionnalité: aires de texte s’auto-redimensionnent
  • Meilleure compréhension des attributs et du html
  • Meilleure personnalisation pour l’envoi de document
  • Alignement des cases plus cohérent avec de longues ou courtes étiquettes

1.5.3

  • Le short-code [md-text] fonctionne maintenant avec le sélecteur de date html5

1.5.2

  • Correction d’un problème de marge négative avec la grille CSS

1.5.1

  • Mises à jours mineures

1.5.0

  • [Premium version] allow turning checkboxes and radios into switches
  • Update to fix vertical spacing with CSS grid

1.4.0

  • Ajout du champ upload de fichier

1.3.3

  • Added spacing options
  • Ajout d’aide pour le quiz et recaptcha

1.3.2

  • Improved docs

1.3.1

  • Minor bug fixes
  • Ensure CF7 plugin is active

1.3.0

  • Added plugin sub-menu page
  • Add pro version info

1.2.0

  • Under the hood updates

1.1.0

  • Refactored CSS to be more specific
  • Added dark theme option

1.0.0

  • First release