1
00:00:00,000 --> 00:00:02,910
J'ai juste construit
 la page du blog et maintenant

2
00:00:02,910 --> 00:00:05,400
nous
 allons construire une autre page
 très importante,

3
00:00:05,400 --> 00:00:08,300
et ce
 sera la page Contact. 

4
00:00:08,295 --> 00:00:10,565
Idéalement, bien sûr, sur
 votre page de contact, vous souhaitez

5
00:00:10,560 --> 00:00:13,300
avoir une sorte de formulaire de contact,

6
00:00:13,304 --> 00:00:15,224
peut-être même une carte Google. 

7
00:00:15,225 --> 00:00:17,645
Si vous avez un emplacement physique. 

8
00:00:17,640 --> 00:00:19,140
Sinon, nous n'avons pas d'emplacement
 physique,

9
00:00:19,140 --> 00:00:21,510
mais nous allons
 ajouter un formulaire de contact. 

10
00:00:21,510 --> 00:00:24,810
Maintenant, il existe plusieurs plugins

11
00:00:24,810 --> 00:00:26,820
pour créer des formulaires de
 contact. 

12
00:00:26,820 --> 00:00:28,440
Et en fait, si vous utilisez

13
00:00:28,440 --> 00:00:30,360
la version payante d'Elemental,

14
00:00:30,360 --> 00:00:33,360
vous aurez l'élément de formulaire. 

15
00:00:33,355 --> 00:00:35,575
Mais nous utilisons la version
 gratuite d'Elemental. 

16
00:00:35,570 --> 00:00:38,140
Nous allons donc
 installer un autre plugin. 

17
00:00:38,135 --> 00:00:42,985
Et ce plugin s'appelle
 les plugins WP Forms. 

18
00:00:42,980 --> 00:00:45,820
Permettez-moi donc de taper des formulaires WP. 

19
00:00:45,815 --> 00:00:47,735
Et c'est le seul ici. 

20
00:00:47,735 --> 00:00:50,035
Très bien, alors
 allons-y l'installation. 

21
00:00:50,030 --> 00:00:54,510
Et nous allons maintenant
 activer le plugin. 

22
00:00:54,610 --> 00:00:58,520
Très bien, donc nous
 allons simplement cliquer

23
00:00:58,520 --> 00:01:02,200
sur créer votre premier
 formulaire ici. 

24
00:01:02,195 --> 00:01:05,095
bien avec ce plugin
 particulier, c'est qu'il

25
00:01:05,090 --> 00:01:07,970
s'intègre très bien
 avec elemental. 

26
00:01:07,969 --> 00:01:10,999
Je vais taper
 un nom ici. 

27
00:01:11,000 --> 00:01:13,460
Ce
 sera donc le formulaire de contact. 

28
00:01:13,460 --> 00:01:15,460
Ce sera le
 nom de ce formulaire. 

29
00:01:15,455 --> 00:01:19,295
formulaire de contact est disponible ici. 

30
00:01:19,295 --> 00:01:21,785
Vous avez nos
 différents modèles,

31
00:01:21,784 --> 00:01:24,324
allez choisir le facteur de formulaire de
 contact simple. 

32
00:01:24,320 --> 00:01:26,300
Nous pouvons voir la démo ici. 

33
00:01:26,300 --> 00:01:27,940
Vous pouvez voir que c'est
 la démo ici. 

34
00:01:27,935 --> 00:01:28,795
Très, très simple. 

35
00:01:28,790 --> 00:01:31,690
Vous aurez le nom, l'e-mail,
 puis les champs de message. 

36
00:01:31,685 --> 00:01:34,625
Donc cela devrait convenir à
 nos objectifs,

37
00:01:34,625 --> 00:01:37,865
je vais aller de l'avant et simplement
 cliquer sur Utiliser le modèle. 

38
00:01:38,110 --> 00:01:40,280
C'est en soi, mais
 je vais apporter

39
00:01:40,280 --> 00:01:43,010
quelques modifications au

40
00:01:43,010 --> 00:01:44,420
fonctionnement du plug-in
 tel qu'il est ici,

41
00:01:44,420 --> 00:01:46,010
vous avez les champs disponibles

42
00:01:46,010 --> 00:01:47,600
pour vous avec la version gratuite,

43
00:01:47,600 --> 00:01:50,150
il y a une version payante
 où vous avez accès à

44
00:01:50,150 --> 00:01:51,800
ces champs sophistiqués et

45
00:01:51,800 --> 00:01:54,040
aux champs de paiement,
 etc., mais nous n'en avons pas besoin. 

46
00:01:54,035 --> 00:01:56,125
Donc, le gingembre que je vais
 faire ici serait

47
00:01:56,120 --> 00:01:57,970
de modifier le champ de nom. 

48
00:01:57,965 --> 00:02:01,145
Je vais donc simplement cliquer
 à l'intérieur. 

49
00:02:01,145 --> 00:02:04,435
Et ici, vous
 avez le format. 

50
00:02:04,430 --> 00:02:06,560
Je préfère le
 format simple où vous n'
avez qu'

51
00:02:06,560 --> 00:02:09,190
une seule
 ligne pour le nom. 

52
00:02:09,185 --> 00:02:11,605
Mais vous avez forcé le milieu,

53
00:02:11,600 --> 00:02:14,290
dernier, le premier, le
 dernier, et ainsi de suite. 

54
00:02:14,285 --> 00:02:16,135
Sur l'Advanced, vous pouvez modifier

55
00:02:16,130 --> 00:02:19,450
la taille du champ pour
 lancer deux petits,

56
00:02:19,445 --> 00:02:22,465
en fonction de vos goûts
 et de ce que vous préférez. 

57
00:02:22,460 --> 00:02:24,710
Vous pouvez ajouter vos
 lunettes CSS ici. 

58
00:02:24,710 --> 00:02:26,030
Vous avez aussi une logique intelligente,

59
00:02:26,030 --> 00:02:27,260
ce qui, oups, je suis
 désolée. 

60
00:02:27,260 --> 00:02:28,010
J'ai oublié. 

61
00:02:28,010 --> 00:02:31,790
Cette option n'est disponible qu'avec
 la version payante,

62
00:02:31,790 --> 00:02:33,640
pour les options de terrain. 

63
00:02:33,635 --> 00:02:35,545
C'est ça. Vous pouvez donc
 revenir ici et ajouter des

64
00:02:35,540 --> 00:02:38,930
champs
 supplémentaires
 comme des cases à cocher déroulantes. 

65
00:02:38,930 --> 00:02:41,110
Si vous le vouliez. 

66
00:02:41,105 --> 00:02:43,625
Sous configuration ici,

67
00:02:43,625 --> 00:02:45,215
je suis désolé, sous paramètres,

68
00:02:45,215 --> 00:02:47,365
que
 ce soit ici, c'est ici que vous pouvez

69
00:02:47,360 --> 00:02:49,510
modifier des choses comme le nom du formulaire
 lui-même. 

70
00:02:49,505 --> 00:02:50,875
Vous pouvez modifier le texte
 du

71
00:02:50,870 --> 00:02:53,770
bouton et
 influencer les applications. 

72
00:02:53,765 --> 00:02:55,675
C'est ici que vous pouvez

73
00:02:55,670 --> 00:02:57,620
configurer les types de
 notifications que vous souhaitez

74
00:02:57,620 --> 00:03:00,520
recevoir chaque fois que quelqu'un envoie

75
00:03:00,515 --> 00:03:02,725
le formulaire de contact. 

76
00:03:02,720 --> 00:03:05,330
Nous voulons être avertis
 ici par défaut,

77
00:03:05,330 --> 00:03:06,980
l'e-mail d'administration
 associé à

78
00:03:06,980 --> 00:03:08,600
votre
 site Web WordPress sera ici,

79
00:03:08,600 --> 00:03:11,510
mais vous pouvez ajouter vos propres éléments de messagerie
 personnalisés. 

80
00:03:11,510 --> 00:03:13,480
te montrer quelque chose,
 d'accord, juste ici,

81
00:03:13,475 --> 00:03:15,485
où vous avez du nom. 

82
00:03:15,485 --> 00:03:19,025
Par défaut, il sera défini sur le nom
 de votre site Web,

83
00:03:19,025 --> 00:03:22,075
mais il sera beaucoup plus
 logique de les définir

84
00:03:22,070 --> 00:03:26,210
le nom réel de la
 personne qui envoie le message. 

85
00:03:26,210 --> 00:03:28,510
Donc, ici, je clique
 sur Afficher les balises intelligentes. 

86
00:03:28,505 --> 00:03:30,905
Il suffit de choisir le champ Nom,

87
00:03:30,905 --> 00:03:32,305
ou votre prénom, LastName,

88
00:03:32,300 --> 00:03:34,810
en fonction du type de sentiment
 que vous avez pour le nom. 

89
00:03:34,805 --> 00:03:37,555
Et puis même pour
 les e-mails. 

90
00:03:37,550 --> 00:03:40,300
Nous allons simplement choisir
 le champ e-mail. 

91
00:03:40,295 --> 00:03:45,235
Et je vais aller de l'avant
 et simplement économiser. 

92
00:03:45,230 --> 00:03:48,260
Vous avez les conformations
 ici aussi bien que OK, que

93
00:03:48,260 --> 00:03:51,280
se
 passe-t-il une fois qu'ils ont
 rempli le formulaire de contact ? 

94
00:03:51,275 --> 00:03:52,865
Est-ce qu'ils reçoivent un message ? Si c'est le cas,

95
00:03:52,865 --> 00:03:54,565
c'est ici que vous pouvez
 modifier le message. 

96
00:03:54,560 --> 00:03:56,900
Vous pouvez les afficher sur une page
 particulière et ce
 sera

97
00:03:56,900 --> 00:03:59,770
une beauté particulière
 de tout créé. 

98
00:03:59,765 --> 00:04:01,315
Vous pouvez simplement les rediriger vers

99
00:04:01,310 --> 00:04:04,340
une URL externe si
 vous le souhaitez. 

100
00:04:04,340 --> 00:04:05,570
Nous ne ferons rien de tout ça. 

101
00:04:05,570 --> 00:04:06,860
Allons de l'avant maintenant tout simplement pour

102
00:04:06,860 --> 00:04:09,530
gagner encore une fois, fermez ceci. 

103
00:04:09,530 --> 00:04:14,890
Nous allons maintenant passer
 à la page de contact. 

104
00:04:14,885 --> 00:04:17,155
Allons de l'avant et éditons d'
abord la page

105
00:04:17,150 --> 00:04:20,400
depuis le backend
 WordPress. 

106
00:04:20,410 --> 00:04:23,480
Ensuite, je
 vais cliquer
 sur Modifier avec Elementor pour

107
00:04:23,480 --> 00:04:25,810
que nous puissions maintenant

108
00:04:25,805 --> 00:04:31,565
utiliser l'interface Elementor
 et vérifier cela. 

109
00:04:31,565 --> 00:04:35,605
Très bien, oups, j'ai
 oublié de faire une chose. 

110
00:04:35,600 --> 00:04:36,680
Mes excuses. 

111
00:04:36,680 --> 00:04:38,680
Nous devons activer

112
00:04:38,675 --> 00:04:43,675
les formulaires WP sont des extensions pour
 les éléments essentiels. 

113
00:04:43,670 --> 00:04:44,840
Faisons donc rapidement cela. 

114
00:04:44,840 --> 00:04:47,580
Je vais aller voir les atomes
 essentiels ici. 

115
00:04:48,070 --> 00:04:50,470
Passons aux éléments. 

116
00:04:50,465 --> 00:04:55,465
Et puis, ici, vous avez
 les éléments de style de formulaire. 

117
00:04:55,460 --> 00:04:57,110
Vous verrez WP Forms. 

118
00:04:57,110 --> 00:04:59,510
Allons de l'avant et
 maintenant, activez-le. 

119
00:04:59,510 --> 00:05:01,040
Vous pouvez voir que vous avez accès à

120
00:05:01,040 --> 00:05:02,930
d'autres types de formes
 comme les formes fluides,

121
00:05:02,930 --> 00:05:04,250
Gravity Forms, qui
 sont en fait de très,

122
00:05:04,250 --> 00:05:05,570
très bonnes formes Ninja et ainsi de suite. 

123
00:05:05,570 --> 00:05:09,650
Quoi qu'il en soit, continuons
 et sauvegardons nos paramètres. 

124
00:05:09,650 --> 00:05:12,440
Et je vais fermer ça. 

125
00:05:12,440 --> 00:05:15,180
Rafraîchissons cette
 page une fois de plus. 

126
00:05:15,670 --> 00:05:18,410
Ok, donc le problème
 avec les formulaires WE

127
00:05:18,410 --> 00:05:20,570
est que même avec la
 version gratuite d'Elemental,

128
00:05:20,570 --> 00:05:23,420
vous aurez accès
 à l'élément. 

129
00:05:23,420 --> 00:05:26,120
Une fois que vous avez installé et
 activé le plugin,

130
00:05:26,120 --> 00:05:28,400
vous pouvez le voir
 ici sur la base,

131
00:05:28,400 --> 00:05:31,330
vous avez des formulaires WP d'Elemental. 

132
00:05:31,325 --> 00:05:34,345
Je vais cliquer sur
 glisser à l'intérieur ici. 

133
00:05:34,340 --> 00:05:36,950
Et je vais vous montrer la
 différence entre
 celui-ci

134
00:05:36,950 --> 00:05:39,440
et celui fourni
 par les modules complémentaires essentiels. 

135
00:05:39,440 --> 00:05:42,430
Revenons en arrière,
 faites défiler jusqu'ici. 

136
00:05:42,425 --> 00:05:44,845
Ajoutons celui des

137
00:05:44,840 --> 00:05:48,580
modules complémentaires
 essentiels dans
 une autre section. 

138
00:05:48,575 --> 00:05:51,685
Maintenant, vous allez voir
 la principale différence, d'accord ? 

139
00:05:51,680 --> 00:05:53,770
C'est celui qui concerne
 les atomes essentiels. 

140
00:05:53,765 --> 00:05:55,435
Je vais choisir
 le contact pour le

141
00:05:55,430 --> 00:05:57,250
taux de
 mortalité. Il s'
agit de sélectionner le formulaire. 

142
00:05:57,245 --> 00:06:00,235
Nous allons choisir ça. 
Maintenant, juste ici. 

143
00:06:00,230 --> 00:06:02,750
Comparez celui-ci avec
 celui d'ici. 

144
00:06:02,750 --> 00:06:04,820
Allons-y avec celui
 des premiers éléments. 

145
00:06:04,820 --> 00:06:06,880
Nous allons également choisir le formulaire de
 contact. 

146
00:06:06,875 --> 00:06:09,895
Le fait est que vous n'

147
00:06:09,890 --> 00:06:13,190
avez accès qu'au type
 de formulaire à choisir. 

148
00:06:13,190 --> 00:06:14,660
Les options d'affichage sont bonnes. 

149
00:06:14,660 --> 00:06:15,800
Vous souhaitez capturer le nom du formulaire,
 la description,

150
00:06:15,800 --> 00:06:18,150
puis avancer. 

151
00:06:18,154 --> 00:06:20,344
n'y a rien de plus là-dedans. 

152
00:06:20,345 --> 00:06:24,145
Cependant, pour celui
 qui possède des modules complémentaires essentiels,

153
00:06:24,140 --> 00:06:27,050
vous avez accès à beaucoup plus. 

154
00:06:27,050 --> 00:06:30,460
Vous pouvez afficher les
 étiquettes de description, veuillez la tenir. 

155
00:06:30,455 --> 00:06:32,455
Vous avez même reçu nos messages
 d'erreur. 

156
00:06:32,450 --> 00:06:33,560
Vous souhaitez afficher des messages d'erreur

157
00:06:33,560 --> 00:06:34,790
ou souhaitez-vous les masquer ? 

158
00:06:34,790 --> 00:06:36,140
Par exemple, si quelqu'un

159
00:06:36,140 --> 00:06:37,640
n'a pas rempli le champ de
 nom, puis

160
00:06:37,640 --> 00:06:39,020
appuyez sur Soumettre, vous vouliez
 afficher

161
00:06:39,020 --> 00:06:40,940
le
 message d'erreur ou non. 

162
00:06:40,940 --> 00:06:44,570
Vous avez accès à
 de nombreuses options de style. 

163
00:06:44,570 --> 00:06:46,580
Vous pouvez ajouter une couleur d'
arrière-plan de formulaire. 

164
00:06:46,580 --> 00:06:49,610
Vous pouvez aligner le formulaire
 à vos marges de largeur. 

165
00:06:49,610 --> 00:06:51,860
Vous disposez de toutes sortes d'options de
 style pour

166
00:06:51,860 --> 00:06:54,190
les
 étiquettes de titre et de description, etc. 

167
00:06:54,185 --> 00:06:55,435
Toutes ces options,

168
00:06:55,430 --> 00:06:58,000
vous ne les obtenez pas avec celle

169
00:06:57,995 --> 00:06:59,515
avec l'élément fourni par

170
00:06:59,510 --> 00:07:01,070
la version gratuite d'Elemental. 

171
00:07:01,070 --> 00:07:02,150
C'est pourquoi je préfère

172
00:07:02,150 --> 00:07:05,030
utiliser celui fourni
 par les atomes essentiels. 

173
00:07:05,030 --> 00:07:08,210
Donc, je vais aller de l'avant et
 fermer celle-ci par Elemental. 

174
00:07:08,209 --> 00:07:10,059
Marchons sur celui-ci. 

175
00:07:10,055 --> 00:07:11,995
Très, très simple. 

176
00:07:11,990 --> 00:07:15,740
Nous n'allons pas apporter de changements
 énormes ici, sauf

177
00:07:15,740 --> 00:07:19,870
que nous allons simplement cacher le
 titre de l'annuaire téléphonique. 

178
00:07:19,865 --> 00:07:21,445
Tout le monde sait qu'il s'agit
 d'un formulaire de contact,

179
00:07:21,440 --> 00:07:24,460
il n'est
 donc pas nécessaire de
 changer quoi que ce soit ici. 

180
00:07:24,455 --> 00:07:25,945
Une chose que nous allons faire, c'

181
00:07:25,940 --> 00:07:28,580
est de masquer le titre de la page. 

182
00:07:28,580 --> 00:07:31,270
Ensuite, nous ajouterons
 notre propre titre. 

183
00:07:31,265 --> 00:07:33,175
Très bien, et nous allons
 simplement choisir celui-ci

184
00:07:33,170 --> 00:07:34,700
comme un H1 pour la typographie de

185
00:07:34,700 --> 00:07:38,650
style,
 qui est primordiale.
 

186
00:07:38,645 --> 00:07:44,165
Et nous allons tout simplement le plus froid
 Swan notre Contactez-nous. 

187
00:07:44,165 --> 00:07:45,715
C'est ça. 

188
00:07:45,710 --> 00:07:51,480
Nous ajouterons un peu de rembourrage
 aux valeurs des liens de section. 

189
00:07:51,484 --> 00:07:57,514
On va y aller avec 50 en
 haut, puis 50 en dessous. 

190
00:07:57,514 --> 00:08:00,024
En fait, j'y pense. 

191
00:08:00,020 --> 00:08:03,100
Le livre Contactez-nous est en fait
 très, très volumineux. 

192
00:08:03,095 --> 00:08:05,815
C'est bon, nous allons juste aligner
 celui-ci au milieu. 

193
00:08:05,810 --> 00:08:07,960
Et nous ajouterons simplement
 un motif pour

194
00:08:07,955 --> 00:08:10,055
le formulaire lui-même. 

195
00:08:10,055 --> 00:08:11,585
Je vais cliquer
 sur l'élément de formulaire. 

196
00:08:11,585 --> 00:08:12,895
Allons à Advanced. 

197
00:08:12,890 --> 00:08:15,400
Et nous
 ajouterons également du rembourrage. 

198
00:08:15,395 --> 00:08:17,305
Il suffit de lui donner une certaine
 distance entre

199
00:08:17,300 --> 00:08:20,540
le titre réel et
 le formulaire lui-même. 

200
00:08:20,540 --> 00:08:23,360
Allez-y et mettez-le à jour. 

201
00:08:23,360 --> 00:08:27,650
C'est ce que je vais aller de
 l'avant maintenant et voir la page. 

202
00:08:27,650 --> 00:08:32,280
Et c'est tout pour
 la page Contactez-nous. 

203
00:08:32,275 --> 00:08:35,725
Encore une fois, vous pouvez rendre
 cela un peu plus excitant. 

204
00:08:35,720 --> 00:08:37,610
Vous pouvez utiliser
 peut-être deux colonnes

205
00:08:37,610 --> 00:08:39,380
par
 opposition à une section. 

206
00:08:39,380 --> 00:08:41,620
la première colonne, vous pouvez ajouter
 une

207
00:08:41,615 --> 00:08:43,705
image de quelqu'un
 qui peut appeler ou

208
00:08:43,700 --> 00:08:46,190
quelqu'un qui envoie un
 e-mail, ce genre de choses. 

209
00:08:46,190 --> 00:08:48,020
Il existe donc différentes
 façons de modifier

210
00:08:48,020 --> 00:08:49,670
la page Contactez-nous
 et de la rendre plus

211
00:08:49,670 --> 00:08:51,740
excitante si vous le souhaitez. 

212
00:08:51,740 --> 00:08:53,960
Mais c'est très, très simple,

213
00:08:53,959 --> 00:08:57,649
très simple, et
 cela correspond à nos objectifs. 

214
00:08:57,650 --> 00:08:59,150
Merci donc d'avoir regardé et

215
00:08:59,150 --> 00:09:01,410
je vous verrai dans
 le prochain cours.