{"id":31303,"date":"2020-07-15T07:04:40","date_gmt":"2020-07-15T07:04:40","guid":{"rendered":"https:\/\/blogging-techies.com\/fr\/comment-creer-des-formulaires-amp-dans-wordpress-le-plus-simple\/"},"modified":"2020-07-15T07:04:40","modified_gmt":"2020-07-15T07:04:40","slug":"comment-creer-des-formulaires-amp-dans-wordpress-le-plus-simple","status":"publish","type":"post","link":"https:\/\/blogging-techies.com\/fr\/comment-creer-des-formulaires-amp-dans-wordpress-le-plus-simple\/","title":{"rendered":"Comment cr\u00e9er des formulaires AMP dans WordPress (le plus simple)"},"content":{"rendered":"

Voulez-vous cr\u00e9er des formulaires compatibles AMP sur votre site WordPress? <\/p>\n

Accelerated Mobile Pages, ou AMP, est un projet Google qui acc\u00e9l\u00e8re le chargement des sites Web sur les appareils mobiles. <\/p>\n

Bien que AMP offre une excellente exp\u00e9rience de navigation mobile, en acc\u00e9l\u00e9rant le chargement de vos pages, il d\u00e9sactive de nombreuses fonctionnalit\u00e9s utiles sur votre site Web. <\/p>\n

L’un est le formulaire de contact. Comme AMP utilise un ensemble limit\u00e9 de code HTML et JavaScript, vous ne pouvez pas charger correctement vos formulaires WordPress sur les pages AMP. <\/p>\n

Mais heureusement, il existe d\u00e9sormais une solution simple. WPForms, le plugin de formulaires WordPress le plus convivial pour les d\u00e9butants, vous aide d\u00e9sormais \u00e0 cr\u00e9er des formulaires WordPress pr\u00eats pour AMP. Son \u00e9quipe a r\u00e9cemment travaill\u00e9 avec Google pour faciliter les formulaires AMP pour WordPress. <\/p>\n

Dans cet article, nous vous montrerons comment cr\u00e9er des formulaires AMP dans WordPress \u00e0 l’aide de WPForms (la mani\u00e8re la plus simple). <\/p>\n

\"Cr\u00e9ez<\/p>\n

<\/span>Cr\u00e9ez des formulaires AMP dans WordPress (\u00e9tape par \u00e9tape)<\/span><\/h4>\n

Pour utiliser AMP avec WordPress, vous devez installer et activer le plugin AMP officiel pour WordPress. Pour plus de d\u00e9tails, consultez notre guide \u00e9tape par \u00e9tape sur la fa\u00e7on d’installer un plugin WordPress. <\/p>\n

Une fois activ\u00e9, le plugin ajoutera automatiquement la prise en charge de Google AMP \u00e0 votre site WordPress. <\/p>\n

Cependant, vous pouvez modifier les param\u00e8tres AMP de votre site en visitant AMP \u00bbG\u00e9n\u00e9ral<\/strong> de votre panneau. <\/p>\n

\"Param\u00e8tres<\/p>\n

Sur la page des param\u00e8tres AMP, vous pouvez activer ou d\u00e9sactiver AMP sur votre site, choisir un mode de site pour AMP et choisir les mod\u00e8les pris en charge. <\/p>\n

Apr\u00e8s avoir configur\u00e9 AMP, l’\u00e9tape suivante consiste \u00e0 cr\u00e9er un formulaire de contact compatible AMP sur votre site WordPress.<\/p>\n

<\/span>\u00c9tape 1. Cr\u00e9ez un formulaire WordPress avec WPForms<\/span><\/h4>\n

Pour commencer, installez et activez le plugin WPForms Lite sur votre site Web. Il s’agit de la version all\u00e9g\u00e9e du plugin WPForms Pro. <\/p>\n

Les versions all\u00e9g\u00e9e et professionnelle de WPForms vous permettent de cr\u00e9er un formulaire de contact de base compatible AMP. Dans notre article, nous utiliserons la version gratuite pour les captures d’\u00e9cran.<\/p>\n

Apr\u00e8s avoir install\u00e9 et activ\u00e9 le plugin, vous devez vous rendre sur WPForms \u00bbAjouter un nouveau<\/strong> page pour cr\u00e9er un nouveau formulaire WordPress. <\/p>\n

Sur l’\u00e9cran des param\u00e8tres du formulaire, vous pouvez choisir un mod\u00e8le de formulaire pour d\u00e9marrer rapidement. Vous pouvez s\u00e9lectionner le formulaire vierge si vous souhaitez recommencer \u00e0 z\u00e9ro. <\/p>\n

\"Mod\u00e8les<\/p>\n

La page de cr\u00e9ation de formulaire s’ouvre alors. <\/p>\n

\"Faites<\/p>\n

De l\u00e0, vous pouvez ajouter ou supprimer des champs de formulaire. Pour ajouter un nouveau champ \u00e0 votre formulaire, cliquez simplement sur un champ dans le volet gauche et il appara\u00eetra dans le panneau de cr\u00e9ation de formulaire \u00e0 droite. <\/p>\n

Apr\u00e8s cela, vous pouvez configurer les options de champ. Cliquez simplement sur un champ et les options du champ appara\u00eetront. <\/p>\n

\"D\u00e9finir<\/p>\n

De m\u00eame, vous pouvez personnaliser tous les autres champs. <\/p>\n

Apr\u00e8s cela, vous pouvez cliquer sur l’onglet Param\u00e8tres pour configurer vos param\u00e8tres de formulaire. <\/p>\n

\"Param\u00e8tres<\/p>\n

Les param\u00e8tres g\u00e9n\u00e9raux vous permettent de modifier le nom de votre formulaire, d’envoyer le texte du bouton, d’envoyer le traitement du bouton, d’activer l’antispam Honeypot et bien plus encore. <\/p>\n

Ensuite, vous pouvez cliquer sur l’onglet Notifications pour configurer des notifications par e-mail qui vous avertissent lorsqu’un utilisateur remplit le formulaire. <\/p>\n

\"Param\u00e8tres<\/p>\n

Vous pouvez cliquer sur l’onglet Confirmation pour configurer un message de confirmation qui appara\u00eetra lorsqu’un utilisateur soumettra le formulaire.<\/p>\n

\"Param\u00e8tres<\/p>\n

Une fois l’installation termin\u00e9e, vous pouvez enregistrer votre formulaire. <\/p>\n

<\/span>\u00c9tape 2. Ajoutez votre formulaire AMP \u00e0 une page<\/span><\/h4>\n

Maintenant que votre formulaire WordPress est pr\u00eat, vous pouvez l’ajouter \u00e0 une page. <\/p>\n

Tout d’abord, vous devez cr\u00e9er une nouvelle page ou ouvrir une page existante \u00e0 laquelle vous souhaitez ajouter le formulaire. <\/p>\n

Sur l’\u00e9cran d’\u00e9dition de votre page, cliquez sur l’ic\u00f4ne Ajouter un nouveau bloc et s\u00e9lectionnez le bloc WPForms. <\/p>\n

\"Ajouter<\/p>\n

Apr\u00e8s cela, vous pouvez voir le widget WPForms ajout\u00e9 \u00e0 l’\u00e9cran d’\u00e9dition de votre page. Il vous suffit de s\u00e9lectionner le formulaire que vous avez cr\u00e9\u00e9 pr\u00e9c\u00e9demment, et le widget le chargera instantan\u00e9ment dans l’\u00e9diteur de page. <\/p>\n

\"Ajouter<\/p>\n

Vous pouvez publier ou mettre \u00e0 jour votre page. <\/p>\n

C’est tout! Vous n’avez pas besoin de configurer autre chose. Le plugin WPForms Lite ajoutera d\u00e9sormais une prise en charge AMP compl\u00e8te \u00e0 votre formulaire. <\/p>\n

Si vous voulez voir \u00e0 quoi il ressemble, vous pouvez ouvrir la page sur votre appareil mobile. <\/p>\n

Ou pouvez-vous ouvrir la page dans le navigateur du bureau en ajoutant \/ amp \/ ou \/? Amplificateur \u00e0 la fin de la page URL. Par exemple, https:\/\/www.example.com\/contact\/?amp. <\/p>\n

<\/span>Ajoutez Google reCAPTCHA \u00e0 votre formulaire AMP<\/span><\/h4>\n

Par d\u00e9faut, WPForms inclut un pot de miel anti-spam pour attraper et bloquer le spam. De plus, vous pouvez utiliser Google reCAPTCHA pour r\u00e9duire les envois de spam. <\/p>\n

Pour utiliser Google reCAPTCHA avec vos formulaires AMP, vous devez enregistrer votre site avec Google reCAPTCHA v3 et obtenir les cl\u00e9s de l’API Google. <\/p>\n

Acc\u00e9dez au site Web Google reCAPTCHA et cliquez sur le bouton “Console d’administration” dans le coin sup\u00e9rieur droit de la page. <\/p>\n

\"Visitez<\/p>\n

Apr\u00e8s cela, vous devez vous connecter avec votre compte Google. Une fois cela fait, vous verrez la page “Enregistrer un nouveau site Web”. <\/p>\n

\"Enregistrer<\/p>\n

Tout d’abord, vous devez entrer le nom de votre site Web dans le champ \u00c9tiquette. Google AMP ne prend en charge que reCAPTCHA v3, vous devez donc choisir entre les options de type reCAPTCHA. <\/p>\n

Apr\u00e8s cela, entrez votre nom de domaine dans la section Domaines. <\/p>\n

\"Ajouter<\/p>\n

La section Propri\u00e9taires affiche l’adresse e-mail par d\u00e9faut. Vous pouvez \u00e9galement ajouter un autre e-mail si vous le souhaitez. <\/p>\n

Vous devez accepter les conditions d’utilisation de reCAPTCHA pour continuer. Cochez \u00e9galement la case \u00abEnvoyer des alertes aux propri\u00e9taires\u00bb, qui permettra \u00e0 Google de vous informer de probl\u00e8mes tels que des param\u00e8tres incorrects et du trafic suspect sur votre site. <\/p>\n

\"Acceptez<\/p>\n

Une fois termin\u00e9, cliquez sur le bouton Soumettre. <\/p>\n

Vous verrez un message de r\u00e9ussite avec la cl\u00e9 du site et la cl\u00e9 secr\u00e8te pour ajouter reCAPTCHA \u00e0 votre site. <\/p>\n

\"Cl\u00e9s<\/p>\n

Vous disposez d\u00e9sormais des cl\u00e9s de l’API Google pour ajouter reCAPTCHA \u00e0 vos formulaires. Cependant, un ajustement suppl\u00e9mentaire est n\u00e9cessaire pour garantir la compatibilit\u00e9 AMP avec reCATCHA. Cliquez sur le lien “Acc\u00e9der aux param\u00e8tres”. <\/p>\n

Vous verrez \u00e0 nouveau les param\u00e8tres reCAPTCHA avec la case \u00e0 cocher “Autoriser cette cl\u00e9 \u00e0 fonctionner avec les pages AMP”. Cochez simplement la case et cliquez sur le bouton Enregistrer ci-dessous. <\/p>\n

\"Laissez<\/p>\n

Maintenant que vous disposez des cl\u00e9s de l’API Google pour ajouter reCAPTCHA aux formulaires AMP, ouvrez WPForms \u00bbConfiguration\u00bb reCAPTCHA<\/strong> page dans votre tableau de bord WordPress. <\/p>\n

\"Configuration<\/p>\n

Sur cet \u00e9cran, vous devez choisir l’option reCAPTCHA v3 et coller la cl\u00e9 de site et la cl\u00e9 secr\u00e8te. Apr\u00e8s cela, cliquez sur le bouton Enregistrer les param\u00e8tres. <\/p>\n

Maintenant que Google reCAPTCHA a \u00e9t\u00e9 ajout\u00e9 \u00e0 WPForms, vous pouvez l’activer dans vos formulaires si n\u00e9cessaire. Allons-y WPForms \u00bbTous les formulaires<\/strong> et s\u00e9lectionnez le formulaire dans lequel vous souhaitez activer reCAPTCHA. <\/p>\n

\"Modifier<\/p>\n

Lorsque l’\u00e9cran des param\u00e8tres du formulaire appara\u00eet, cliquez sur l’onglet Param\u00e8tres et s\u00e9lectionnez la section Param\u00e8tres g\u00e9n\u00e9raux. En bas, vous pouvez voir la case “Activer Google v3 reCAPTCHA”. <\/p>\n

\"Activer<\/p>\n

Cochez la case et enregistrez votre formulaire en cliquant sur le bouton Enregistrer dans le coin sup\u00e9rieur droit. <\/p>\n

Apr\u00e8s cela, vous pouvez revoir la page de contact et voir le formulaire AMP avec reCAPTCHA en action. <\/p>\n

Nous esp\u00e9rons que cet article vous a aid\u00e9 \u00e0 apprendre \u00e0 cr\u00e9er facilement des formulaires AMP dans WordPress. Vous pouvez \u00e9galement consulter notre guide sur la fa\u00e7on de cr\u00e9er des formulaires conformes au RGPD dans WordPress. <\/p>\n

Si vous avez aim\u00e9 cet article, abonnez-vous \u00e0 notre cha\u00eene YouTube pour regarder des vid\u00e9os de didacticiel WordPress. Vous pouvez \u00e9galement nous trouver sur Twitter et Facebook<\/p>\n

\n
\n

Table of Contents<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n