Comment compléter automatiquement l'adresse dans WordPress

Vous souhaitez compléter automatiquement les adresses de votre site ? Vous êtes arrivé au bon endroit. Dans ce guide, nous vous montrerons comment compléter automatiquement une adresse dans WordPress (aucun codage requis).

De nos jours, la plupart des magasins de commerce électronique demandent aux clients de remplir un formulaire qui inclut leur adresse lorsqu'ils achètent quelque chose. Vous pouvez soit laisser les utilisateurs entrer leurs adresses manuellement, soit les aider avec un outil de saisie semi-automatique. En complétant automatiquement l'adresse, les utilisateurs peuvent sélectionner un emplacement suggéré parmi quelques adresses qui apparaîtront en temps réel au fur et à mesure de leur saisie.

L'utilisation de la saisie semi-automatique pour les champs d'adresse est très courante dans les magasins de commerce électronique, en particulier dans la section des adresses de facturation et d'expédition, sur la page de paiement ou sur la page Mon compte.

Pourquoi saisir automatiquement l'adresse dans WordPress ?

La saisie semi-automatique d'adresses dans WordPress peut vous aider à améliorer l'expérience utilisateur sur votre site Web . Non seulement les clients pourront entrer leurs adresses plus rapidement, mais vous éviterez également les erreurs et les fautes de frappe.

Au fur et à mesure que les acheteurs saisissent leur adresse, les adresses possibles apparaîtront sur leur écran, il leur suffit donc de sélectionner la bonne. Cela vous aidera à réduire les erreurs, car les options qui s'affichent pour l'utilisateur sont intégrées à Google Places et à l'API Google Maps.

C'est l'une des fonctionnalités les plus pratiques que vous pouvez fournir à vos utilisateurs. En améliorant l'expérience utilisateur sur votre site, vous êtes plus susceptible d'augmenter vos ventes et de transformer cet acheteur occasionnel en client récurrent.

Maintenant que nous comprenons mieux les avantages de l'ajout d'une fonctionnalité d'adresse de saisie semi-automatique dans WordPress, voyons comment l'ajouter à votre site.

Comment compléter automatiquement l'adresse dans WordPress

La méthode la plus simple et la plus efficace pour ajouter une adresse de saisie semi-automatique dans WordPress consiste à utiliser un plugin. Pour ce tutoriel, nous utiliserons Autocomplete Google Address . Il a une interface conviviale et est extrêmement facile à utiliser.

Pour utiliser ce plugin, vous avez juste besoin d'une clé API Google Places et de l'ID de formulaire du champ d'adresse. Ensuite, vous devez suivre une série d'étapes simples pour ajouter une adresse de saisie semi-automatique à un site Web WordPress. Les étapes sont les suivantes:

1. Installez et activez le plugin

Pour installer et activer le plugin Autocomplete Google Address, dans votre administrateur WordPress, allez dans Plugins > Add New . Ensuite, recherchez le plugin dans la barre de recherche. Après cela, cliquez sur Installer maintenant , puis activez-le.

2. Entrez la clé API Google Place

Une fois que vous avez activé le plugin, accédez à l' onglet Autocomplete de votre tableau de bord. Vous aurez besoin de la clé API Google Place pour votre site Web.

Voyons comment faire cela.

2.1. Comment accéder à la clé API Google Places

Pour accéder à la clé API, connectez-vous à votre compte Google et rendez-vous sur la Google Developer Console . Appuyez ensuite sur Sélectionner un projet et créez un nouveau projet .

Vous devrez saisir le nom du projet et cliquer sur Créer . Ensuite, vous serez redirigé vers votre nouveau projet.

L'étape suivante consiste à activer les API. Pour cela, rendez-vous dans la section Bibliothèque du tableau de bord.

Ici, vous devez rechercher l'API Google Places. C'est généralement l'une des premières options que vous voyez sur cet écran, mais si vous ne la trouvez pas, utilisez la barre de recherche pour la rechercher.

Vous vous retrouvez maintenant sur la page de présentation de l'API Places. Cliquez sur Activer pour autoriser l'API.

Maintenant, revenez à votre tableau de bord, allez dans l'onglet Identifiants et appuyez sur Créer des identifiants . Vous verrez un menu déroulant dans lequel vous devrez sélectionner l'option Clé API .

C'est ça! Vous avez créé avec succès votre clé API. Copiez-le et collez-le simplement dans l' onglet Autocomplete de votre tableau de bord WordPress.

Pour vous assurer que la fonctionnalité d'adresse de saisie semi-automatique fonctionnera correctement dans WordPress, vous devez activer l'API JavaScript de Google Maps . Voyons comment faire cela.

2.2. Activer l'API JavaScript de Google Maps

Pour activer l'API Google Maps JavaScript , accédez d'abord à l' onglet Bibliothèque du tableau de bord de la Google Developer Console . Ensuite, localisez l' API JavaScript de Google Maps , sélectionnez-la et activez -la.

C'est ça! Nous sommes maintenant prêts à passer à l'étape suivante et à ajouter l'ID du formulaire.

3. Entrez l'ID du formulaire

Après avoir entré la clé API Google Place, vous aurez également besoin de l'ID de formulaire du champ d'adresse où vous souhaitez ajouter la fonction d'adresse de saisie semi-automatique. Dans votre tableau de bord WordPress, accédez à Autocomplete . Juste en dessous du champ Clé API, vous trouverez un autre champ pour saisir l'ID du formulaire .

Pour trouver l'ID du formulaire, suivez simplement ces étapes.

3.1. Comment trouver l'ID du formulaire

Pour trouver l'ID de formulaire pour ajouter la fonction d'adresse de saisie semi-automatique, accédez à la page où se trouve le champ. Ensuite, faites un clic droit sur le champ d'adresse et sélectionnez l' option Inspecter . Vous pouvez également cliquer sur la zone de texte du champ et utiliser le raccourci clavier Ctrl+Maj+i.

Maintenant, dans l'onglet Éléments , vous voyez l'outil de développement où vous pouvez inspecter et afficher tous les éléments de la page Web. Si vous n'êtes pas familier avec les codes et la programmation, vous n'avez pas à vous inquiéter. Les codes du champ seront mis en surbrillance. Dans notre cas, l'ID du formulaire est address-form-1 comme vous pouvez le voir ci-dessous.

Comme vous pouvez le voir, il est écrit id = "address-form-1" mais l'ID de formulaire réel est simplement address-form-1.

Trouvez simplement votre ID de formulaire et copiez-le dans le champ ID de formulaire de votre tableau de bord d'administration WordPress.

Maintenant, entrez l'identifiant du formulaire dans l' onglet Autocomplete de votre tableau de bord et enregistrez les modifications, accédez à la page avec le champ d'adresse.

Enfin, collez l'ID du formulaire dans le champ correspondant et enregistrez les modifications . Si vous souhaitez compléter automatiquement plusieurs champs d'adresse, ajoutez chaque ID de formulaire et séparez-les par une virgule.

C'est ça! Vous venez d'ajouter une fonctionnalité d'adresse de saisie semi-automatique dans WordPress. Désormais, lorsque les utilisateurs commenceront à saisir une adresse, un menu déroulant apparaîtra avec toutes les suggestions de localisation. Il leur suffit de sélectionner leur emplacement et l'adresse complète sera saisie automatiquement.

La saisie semi-automatique d'adresses n'est que la première étape. Si vous souhaitez aller plus loin et améliorer encore plus votre expérience client, vous pouvez également compléter automatiquement les commandes sur votre boutique. Voyons comment faire.

Bonus : comment compléter automatiquement les commandes

L'ajout d'une fonction de saisie semi-automatique des commandes est un autre excellent moyen d'améliorer l'expérience client sur votre site. En complétant automatiquement les commandes, vous pouvez traiter et confirmer les commandes instantanément afin que les acheteurs n'aient pas à attendre pour obtenir une confirmation de leur transaction qui peut prendre des heures. De plus, comme les utilisateurs peuvent accéder instantanément aux produits ou services qu'ils achètent, vous n'avez pas à vérifier manuellement leurs commandes. Cela fonctionne très bien pour les produits virtuels et téléchargeables.

Le moyen le plus simple et le plus rapide de compléter automatiquement les commandes sur votre site consiste à utiliser un plugin. Il existe plusieurs outils, mais pour cette démo, nous utiliserons Autocomplete WooCommerce Orders. Cet outil gratuit est l'un des meilleurs plugins du marché et s'intègre de manière transparente à WooCommerce et aux passerelles de paiement comme PayPal pour compléter automatiquement les commandes et confirmer les achats en un rien de temps.

Passons à autre chose et voyons comment utiliser ce plugin. Avant de commencer, assurez-vous que vous avez correctement configuré WooCommerce sur votre site Web.

1. Installer et configurer les commandes WooCommerce Autocomplete

Pour installer le plugin, dans votre tableau de bord WordPress, accédez à Plugins > Ajouter un nouveau et recherchez Autocomplete WooCommerce Orders . Ensuite, cliquez sur Installer maintenant et activez-le.

Après cela, allez dans WooCommerce > Paramètres et ouvrez l' onglet Autocomplete Orders . Ensuite, sélectionnez Commandes payées de produits virtuels uniquement sous Mode et enregistrez les modifications.

2. Accéder à la clé d'identité de transfert de données PayPal

Maintenant, vous devrez obtenir la clé d'identité de transfert de données auprès de PayPal. Pour cela, connectez-vous à votre compte PayPal et accédez aux paramètres. Sous l'onglet Outils du vendeur , cliquez sur le bouton Mettre à jour pour les préférences du site Web .

Vous serez redirigé vers les options de préférence du site Web où vous devrez trouver la section Retour automatique et sélectionner le bouton radio Activé pour activer le retour automatique. Ensuite, entrez votre URL de retour et enregistrez-la.

Après cela, faites défiler jusqu'à la section Transfert de données de paiement et sélectionnez le bouton radio Activé pour l'activer. Votre jeton d'identité pour le transfert des données de paiement s'affichera. Vous aurez besoin de cette clé d'identité, alors copiez-la et placez-la dans un endroit pratique.

3. Entrez la clé d'identité PayPal pour WooCommerce

Pour entrer la clé d'identité PayPal dans WooCommerce, allez dans WooCommerce > Paramètres et ouvrez l' onglet Paiement . Ensuite, appuyez sur le bouton Gérer pour PayPal.

Ici, recherchez l' option de clé d'identité PayPal et entrez la clé d'identité de transfert de données PayPal que vous venez de copier dans la zone de texte. Enfin, configurez d'autres détails pour votre compte PayPal et enregistrez les modifications.

C'est ainsi que vous pouvez ajouter une fonction de saisie automatique des commandes pour WooCommerce. Pour plus de détails sur la façon de le configurer, nous vous recommandons de consulter ce guide étape par étape. De plus, vous pouvez consulter la documentation Autocomplete WooCommerce Orders qui contient de nombreuses informations utiles.

Conclusion

En résumé, une auto- complétion d'adresses est un excellent moyen d'améliorer l'expérience utilisateur sur votre site. Il permet aux acheteurs de gagner du temps lors de la saisie de leurs adresses et vous aide à éviter les erreurs et les fautes de frappe.

Dans ce guide, nous avons vu comment inclure une fonctionnalité d'adresse de saisie semi-automatique dans votre site WordPress sans aucun codage. Nous avons vu comment :

• Activer et configurer le plugin Autocomplete Google Address
• Obtenir la clé API Google Place
• Trouvez le ou les ID de formulaire des champs d'adresse pour ajouter la saisie semi-automatique

De plus, nous avons vu comment compléter automatiquement les commandes à l'aide du plugin Autocomplete WooCommerce Orders . Cela vous aidera à confirmer les commandes instantanément et à augmenter vos ventes.

Si vous avez trouvé cet article utile, voici quelques autres guides pour tirer le meilleur parti de votre site :

• Comment modifier les champs de paiement WooCommerce
• Comment intégrer Google Maps dans WordPress
• Optimisation du paiement : le guide complet

Avez-vous commencé à compléter automatiquement les adresses sur votre site WordPress ? Quelle méthode avez-vous utilisé ? Faites-nous savoir dans la section commentaires ci-dessous!