J'ai juste construit la page du blog et maintenant
nous allons construire une autre page très importante,
et ce sera la page Contact.
Idéalement, bien sûr, sur votre page de contact, vous souhaitez
avoir une sorte de formulaire de contact,
peut-être même une carte Google.
Si vous avez un emplacement physique.
Sinon, nous n'avons pas d'emplacement physique,
mais nous allons ajouter un formulaire de contact.
Maintenant, il existe plusieurs plugins
pour créer des formulaires de contact.
Et en fait, si vous utilisez
la version payante d'Elemental,
vous aurez l'élément de formulaire.
Mais nous utilisons la version gratuite d'Elemental.
Nous allons donc installer un autre plugin.
Et ce plugin s'appelle les plugins WP Forms.
Permettez-moi donc de taper des formulaires WP.
Et c'est le seul ici.
Très bien, alors allons-y l'installation.
Et nous allons maintenant activer le plugin.
Très bien, donc nous allons simplement cliquer
sur créer votre premier formulaire ici.
bien avec ce plugin particulier, c'est qu'il
s'intègre très bien avec elemental.
Je vais taper un nom ici.
Ce sera donc le formulaire de contact.
Ce sera le nom de ce formulaire.
formulaire de contact est disponible ici.
Vous avez nos différents modèles,
allez choisir le facteur de formulaire de contact simple.
Nous pouvons voir la démo ici.
Vous pouvez voir que c'est la démo ici.
Très, très simple.
Vous aurez le nom, l'e-mail, puis les champs de message.
Donc cela devrait convenir à nos objectifs,
je vais aller de l'avant et simplement cliquer sur Utiliser le modèle.
C'est en soi, mais je vais apporter
quelques modifications au
fonctionnement du plug-in tel qu'il est ici,
vous avez les champs disponibles
pour vous avec la version gratuite,
il y a une version payante où vous avez accès à
ces champs sophistiqués et
aux champs de paiement, etc., mais nous n'en avons pas besoin.
Donc, le gingembre que je vais faire ici serait
de modifier le champ de nom.
Je vais donc simplement cliquer à l'intérieur.
Et ici, vous avez le format.
Je préfère le format simple où vous n' avez qu'
une seule ligne pour le nom.
Mais vous avez forcé le milieu,
dernier, le premier, le dernier, et ainsi de suite.
Sur l'Advanced, vous pouvez modifier
la taille du champ pour lancer deux petits,
en fonction de vos goûts et de ce que vous préférez.
Vous pouvez ajouter vos lunettes CSS ici.
Vous avez aussi une logique intelligente,
ce qui, oups, je suis désolée.
J'ai oublié.
Cette option n'est disponible qu'avec la version payante,
pour les options de terrain.
C'est ça. Vous pouvez donc revenir ici et ajouter des
champs supplémentaires comme des cases à cocher déroulantes.
Si vous le vouliez.
Sous configuration ici,
je suis désolé, sous paramètres,
que ce soit ici, c'est ici que vous pouvez
modifier des choses comme le nom du formulaire lui-même.
Vous pouvez modifier le texte du
bouton et influencer les applications.
C'est ici que vous pouvez
configurer les types de notifications que vous souhaitez
recevoir chaque fois que quelqu'un envoie
le formulaire de contact.
Nous voulons être avertis ici par défaut,
l'e-mail d'administration associé à
votre site Web WordPress sera ici,
mais vous pouvez ajouter vos propres éléments de messagerie personnalisés.
te montrer quelque chose, d'accord, juste ici,
où vous avez du nom.
Par défaut, il sera défini sur le nom de votre site Web,
mais il sera beaucoup plus logique de les définir
le nom réel de la personne qui envoie le message.
Donc, ici, je clique sur Afficher les balises intelligentes.
Il suffit de choisir le champ Nom,
ou votre prénom, LastName,
en fonction du type de sentiment que vous avez pour le nom.
Et puis même pour les e-mails.
Nous allons simplement choisir le champ e-mail.
Et je vais aller de l'avant et simplement économiser.
Vous avez les conformations ici aussi bien que OK, que
se passe-t-il une fois qu'ils ont rempli le formulaire de contact ?
Est-ce qu'ils reçoivent un message ? Si c'est le cas,
c'est ici que vous pouvez modifier le message.
Vous pouvez les afficher sur une page particulière et ce sera
une beauté particulière de tout créé.
Vous pouvez simplement les rediriger vers
une URL externe si vous le souhaitez.
Nous ne ferons rien de tout ça.
Allons de l'avant maintenant tout simplement pour
gagner encore une fois, fermez ceci.
Nous allons maintenant passer à la page de contact.
Allons de l'avant et éditons d' abord la page
depuis le backend WordPress.
Ensuite, je vais cliquer sur Modifier avec Elementor pour
que nous puissions maintenant
utiliser l'interface Elementor et vérifier cela.
Très bien, oups, j'ai oublié de faire une chose.
Mes excuses.
Nous devons activer
les formulaires WP sont des extensions pour les éléments essentiels.
Faisons donc rapidement cela.
Je vais aller voir les atomes essentiels ici.
Passons aux éléments.
Et puis, ici, vous avez les éléments de style de formulaire.
Vous verrez WP Forms.
Allons de l'avant et maintenant, activez-le.
Vous pouvez voir que vous avez accès à
d'autres types de formes comme les formes fluides,
Gravity Forms, qui sont en fait de très,
très bonnes formes Ninja et ainsi de suite.
Quoi qu'il en soit, continuons et sauvegardons nos paramètres.
Et je vais fermer ça.
Rafraîchissons cette page une fois de plus.
Ok, donc le problème avec les formulaires WE
est que même avec la version gratuite d'Elemental,
vous aurez accès à l'élément.
Une fois que vous avez installé et activé le plugin,
vous pouvez le voir ici sur la base,
vous avez des formulaires WP d'Elemental.
Je vais cliquer sur glisser à l'intérieur ici.
Et je vais vous montrer la différence entre celui-ci
et celui fourni par les modules complémentaires essentiels.
Revenons en arrière, faites défiler jusqu'ici.
Ajoutons celui des
modules complémentaires essentiels dans une autre section.
Maintenant, vous allez voir la principale différence, d'accord ?
C'est celui qui concerne les atomes essentiels.
Je vais choisir le contact pour le
taux de mortalité. Il s' agit de sélectionner le formulaire.
Nous allons choisir ça. Maintenant, juste ici.
Comparez celui-ci avec celui d'ici.
Allons-y avec celui des premiers éléments.
Nous allons également choisir le formulaire de contact.
Le fait est que vous n'
avez accès qu'au type de formulaire à choisir.
Les options d'affichage sont bonnes.
Vous souhaitez capturer le nom du formulaire, la description,
puis avancer.
n'y a rien de plus là-dedans.
Cependant, pour celui qui possède des modules complémentaires essentiels,
vous avez accès à beaucoup plus.
Vous pouvez afficher les étiquettes de description, veuillez la tenir.
Vous avez même reçu nos messages d'erreur.
Vous souhaitez afficher des messages d'erreur
ou souhaitez-vous les masquer ?
Par exemple, si quelqu'un
n'a pas rempli le champ de nom, puis
appuyez sur Soumettre, vous vouliez afficher
le message d'erreur ou non.
Vous avez accès à de nombreuses options de style.
Vous pouvez ajouter une couleur d' arrière-plan de formulaire.
Vous pouvez aligner le formulaire à vos marges de largeur.
Vous disposez de toutes sortes d'options de style pour
les étiquettes de titre et de description, etc.
Toutes ces options,
vous ne les obtenez pas avec celle
avec l'élément fourni par
la version gratuite d'Elemental.
C'est pourquoi je préfère
utiliser celui fourni par les atomes essentiels.
Donc, je vais aller de l'avant et fermer celle-ci par Elemental.
Marchons sur celui-ci.
Très, très simple.
Nous n'allons pas apporter de changements énormes ici, sauf
que nous allons simplement cacher le titre de l'annuaire téléphonique.
Tout le monde sait qu'il s'agit d'un formulaire de contact,
il n'est donc pas nécessaire de changer quoi que ce soit ici.
Une chose que nous allons faire, c'
est de masquer le titre de la page.
Ensuite, nous ajouterons notre propre titre.
Très bien, et nous allons simplement choisir celui-ci
comme un H1 pour la typographie de
style, qui est primordiale.
Et nous allons tout simplement le plus froid Swan notre Contactez-nous.
C'est ça.
Nous ajouterons un peu de rembourrage aux valeurs des liens de section.
On va y aller avec 50 en haut, puis 50 en dessous.
En fait, j'y pense.
Le livre Contactez-nous est en fait très, très volumineux.
C'est bon, nous allons juste aligner celui-ci au milieu.
Et nous ajouterons simplement un motif pour
le formulaire lui-même.
Je vais cliquer sur l'élément de formulaire.
Allons à Advanced.
Et nous ajouterons également du rembourrage.
Il suffit de lui donner une certaine distance entre
le titre réel et le formulaire lui-même.
Allez-y et mettez-le à jour.
C'est ce que je vais aller de l'avant maintenant et voir la page.
Et c'est tout pour la page Contactez-nous.
Encore une fois, vous pouvez rendre cela un peu plus excitant.
Vous pouvez utiliser peut-être deux colonnes
par opposition à une section.
la première colonne, vous pouvez ajouter une
image de quelqu'un qui peut appeler ou
quelqu'un qui envoie un e-mail, ce genre de choses.
Il existe donc différentes façons de modifier
la page Contactez-nous et de la rendre plus
excitante si vous le souhaitez.
Mais c'est très, très simple,
très simple, et cela correspond à nos objectifs.
Merci donc d'avoir regardé et
je vous verrai dans le prochain cours.