OpenCart One Page Advanced Checkout Extension – Manuel de l’utilisateur

1.0 Présentation

Tous les utilisateurs 1 en ligne qui utilisent 10 sont contraints d’abandonner leur panier simplement à cause du paiement long et compliqué. Vous pouvez optimiser votre achat sur un site intéressant en intégrant l’extension OpenCart One Page Advanced Checkout de Knowband. Le module contextuel OpenCart responsive checkout convertit l’ensemble du processus de paiement en un menu contextuel ajax unique qui se déclenche à l’écran lorsque le client choisit d’acheter un produit dans le magasin. Cette commande en une page pour OpenCart réduit les abandons de panier en offrant l’intégralité du processus d’achat sur une seule fenêtre, sans charger la page suivante.

Fonctionnalités 1.1 de One Page Checkout pour OpenCart

Incorporer One Page Checkout pour le magasin OpenCart n’a rien de grave, car il offre une personnalisation simple sans faire appel à des compétences techniques ni à des modifications de code existantes. Permettez donc rapidement à vos clients d’acheter le produit par l’intermédiaire d’une seule fenêtre contextuelle, ce qui leur permet d’effectuer un paiement plus rapide et de réduire les interruptions. Vous trouverez ci-dessous les points forts de cette extension OpenCart One Page Checkout. 1. Le module OpenCart One Page Checkout affiche le nombre total de champs de commande sous la forme d’une fenêtre contextuelle de vérification basée sur ajax sur le site Web du site Web, sans aucune redirection vers une autre URL. 2. Cette commande en une page pour OpenCart fournit un moyen transparent d’augmenter les abonnements aux newsletters pour les activités en ligne. 3. Le menu contextuel de paiement réactif incorporé à l’aide du module de paiement simplifié OpenCart peut être facilement activé ou désactivé à l’aide du bouton à bascule situé à l’arrière-plan. 4. La fonction d’enregistrement d’invité de OpenCart responsive Checkout popup enregistre automatiquement le client sur le site et lui envoie le mot de passe de connexion sur son courrier électronique. 5. Vous avez la possibilité d’activer ou de désactiver la fonctionnalité d’extraction d’invité du module OpenCart One Page Checkout. 6. En utilisant cette extension de commande OpenCart Single Page, vous pouvez ajouter du code CSS à la page de paiement avancé. 7. Le module de paiement OpenCart une page offre une fonctionnalité de mode test qui vous permet de tester la fonctionnalité de page de paiement avancée sur une adresse IP spécifique. 8. Avec le module de paiement simplifié OpenCart, offrez aux clients les avantages des options de connexion sociale telles que Google et Facebook sur la page de paiement. 9. L’extension de paiement rapide OpenCart vous permet d’afficher / masquer les champs d’adresse de paiement et d’expédition de manière différente pour les clients connectés et invités du magasin. 10. Les champs d’adresse personnalisés peuvent être marqués comme obligatoires ou facultatifs à l’aide de ce module OpenCart One Page Supercheckout. 11. En utilisant One Page Checkout pour le site OpenCart, vous pouvez fournir aux clients plusieurs méthodes d’expédition et de paiement pouvant être configurées à partir du backend. 12. Le module contextuel OpenCart responsive checkout vous permet de définir l’image et le titre du logo de votre choix pour chacun des modes de paiement et d’expédition affichés sur la page de super-achat. 13. La fonctionnalité ship2pay de l’extension de paiement rapide OpenCart sélectionne automatiquement le mode de paiement correspondant à chaque mode d’expédition sélectionné par le client. 14. L’extension popup Openout Checkout Checkout offre un panier configurable dont les champs peuvent être corrigés selon les besoins de l’entreprise. 15. Le module OpenCart One Page Checkout est compatible avec plusieurs magasins et plusieurs langues. 16. L’extension de paiement rapide OpenCart offre aux clients une présentation mobile adaptée. 17. La fonctionnalité MailChimp Integrator d’OpenCart Single Page Checkout synchronise automatiquement les données du client avec le compte MailChimp connecté du vendeur.

Interface frontale 1.2 du module de menu contextuel OpenCart Responsive Checkout

Lorsque l’utilisateur clique sur le bouton “Ajouter au panier” correspondant à un produit, il verra le curseur de commande sensible suivant sur son écran.

Panier Résumé Section de

screenshot-opencartdemo-knowband-com-2019-07-26-11_08_51-1

De plus, lorsqu’ils cliquent sur le bouton “Paiement”, ils peuvent afficher et compléter le formulaire de paiement avancé complet en une seule fois, comme indiqué dans les images ci-dessous:
Section de connexion au compte

screenshot-opencartdemo-knowband-com-2019-07-26-11_11_11

Section de facturation et adresse d’expédition

screenshot-opencartdemo-knowband-com-2019-07-26-11_13_21

Si le client désélectionne la case à cocher “Expédier à la même adresse”, il verra la section de l’adresse de livraison comme indiqué ci-dessous:

screenshot-opencartdemo-knowband-com-2019-07-26-11_15_27
Section des méthodes d’expédition et de paiement

screenshot-opencartdemo-knowband-com-2019-07-26-11_21_19

2.0 Guide d’installation d’OpenCart One Page Advanced Checkout Extension

Avant de commencer le processus d’installation, vous devez acheter le module OpenCart One Page Checkout auprès de la boutique Knowband. Une fois acheté, vous recevrez les fichiers suivants sur votre email enregistré.

  • Code source de l’extension OpenCart One Page Advanced Checkout au format de fichier zippé.
  • Manuel de l’utilisateur de l’extension OpenCart One Page Checkout.

Maintenant, pour installer OpenCart Advanced Checkout sur votre boutique en ligne, suivez les étapes indiquées: 1. Décompressez le fichier zip. Vous obtiendrez les dossiers comme indiqué dans l’image ci-dessous

OpenCart One Page Advanced Checkout
2. Copiez tous les dossiers du fichier zip dans le répertoire racine du programme d’installation OpenCart via le gestionnaire FTP. Donc, OpenCart One Page Advanced Checkout est maintenant installé avec succès et est prêt à être utilisé dans votre magasin. Allez dans le menu admin et cliquez sur les extensions, puis cliquez sur le bouton Configurer à côté de One Page Advanced Checkout.

Interface d’administration 3.0 de OpenCart Responsive Checkout Popup

Juste après l’installation réussie du site Web One Page Checkout pour OpenCart, vous pouvez configurer les champs du formulaire de paiement en fonction de vos besoins. Vous devez parcourir les paramètres dans l’ordre indiqué: Panneau d’administration> Extensions> Modules> Paiement avancé par page

2

3

L’interface d’administration de l’extension de caisse rapide OpenCart, facile à comprendre, est divisée en neuf sections, à savoir: 1.Paramètres généraux 2.Login Paramètres 3.Payment Address 4.Shipping Address 5.Shipping Method Bulletin

Paramètres généraux 3.1

4

  • Activer désactiver: Cette option vous permet d’activer ou de désactiver la fonctionnalité complète du site Web One Page Checkout for Opencart. Si cette option est désactivée, la caisse standard Opencart est présentée aux clients.
  • Activer l’option Newsletter: En utilisant cette option, vous pouvez afficher ou masquer la zone d’abonnement à la newsletter de votre site. Si le client coche l’option newsletter, il s’abonne aux mises à jour du site (newsletter).
  • Enregistrer l’invité automatiquement: Vous pouvez activer l’enregistrement automatique pour vos clients invités (les utilisateurs qui effectuent le paiement des invités). Cette option enverra automatiquement un mot de passe au client pour une utilisation ultérieure du compte.
  • Créer un compte: En activant cette option, vous pouvez indiquer des champs de mot de passe lors de la validation d’une page, où l’utilisateur peut saisir son propre mot de passe pour s’enregistrer.
  • Afficher l’invité: Cette option affichera ou cachera l’option invité dans la section de connexion de la caisse. À l’aide de cette option, les utilisateurs peuvent effectuer un achat invité pour leur article.
  • Ajouter un style personnalisé: Cette option vous permet d’inclure un style personnalisé supplémentaire (code CSS) affiché sur le devant de leur site Web.
  • Mode d’essai: Vous pouvez activer cette option pour tester la fonctionnalité du module de paiement sur une page avant de la mettre en ligne pour les clients.
  • Ajouter une IP: Cette option vous permet de saisir l’adresse IP spécifique à laquelle vous souhaitez tester les fonctionnalités avancées de super-check-out.

Paramètres de connexion 3.2

5

  • Activer la connexion Facebook: Cette option activera ou désactivera l’option de connexion Facebook affichée au premier plan du formulaire de commande d’une page.
  • Identifiant de l’application Facebook: Cette option vous permet de définir l’ID d’application Facebook requis pour vous connecter avec un compte Facebook.
  • Facebook App Secret: Cette option définira la clé secrète de l’application Facebook. Remarque: vous pouvez obtenir l’ID de l’application Facebook et la clé secrète à l’adresse https://developers.facebook.com/ (voir la section 3.2.1).
  • Activer la connexion à Google: Cette option activera ou désactivera l’option de connexion Google affichée au premier plan du formulaire de commande d’une page.
  • Identifiant Google App: Cette option vous permet de définir l’identifiant Google App requis pour vous connecter avec un compte Google.
  • Identifiant client Google: Cette option vous permet de définir l’ID client Google.
  • GoogleCe

Remarque: vous pouvez obtenir l’ID de l’application Google, l’ID client et la clé secrète à l’adresse https://code.google.com/apis/console (voir la section 3.2.2).

3.2.1 Comment configurer la connexion à Facebook

Vous pouvez créer une application Facebook en suivant les étapes mentionnées ci-dessous: – Étape 1: aller à l’URL donnée: https://developers.facebook.com/apps/ Étape 2: cliquer sur le bouton “Ajouter une nouvelle application”. Étape 3 & 4: Entrez votre nom d’application et votre identifiant de messagerie électronique, puis cliquez sur le bouton “Créer un identifiant d’application”.

6
Étape 5 et 6: Après avoir cliqué sur Créer une ID d’application, vous devrez passer un contrôle de sécurité comme indiqué:

7

Étape 7: Cliquez sur l’onglet “Paramètres”.

8

Étape 8-13: Deux options seront disponibles dans le menu déroulant, Basique et Avancé, cliquez sur “Basique”. Ensuite, entrez votre “Domaine d’application”, “Email de contact”, “URL de confidentialité”, “URL de conditions générales”, “Ajouter un logo”, “Sélectionner une catégorie” et cliquez sur le bouton “Enregistrer les modifications”. Domaines d’application: votredomaine.com est correct votredomaine.com/store est incorrect www.domaine.com est incorrect

9

Étape 14: cliquez maintenant sur “+ Ajouter une plate-forme”.

10
Étape 15: et sélectionnez le site Web comme plate-forme

11
Étape 16: Maintenant, entrez l’URL de votre site.

12
Étape 17 & 18: Cliquez sur “Produits +” et sélectionnez le login Facebook.

13
Étape 19: sélectionnez Web comme plate-forme pour l’application.

14
Étape 20: cliquez maintenant sur sauvegarder.

15
Étape 21 et 22: cliquez sur Paramètres et ajoutez un URI de redirection OAuth valide. URI de redirection OAuth valides: https://your_store_url/index.php?route=kbstepcheckout/kbstepcheckout&fblogin=1

16
Étape 23 & 24: Cliquez sur “Révision de l’application”. Et marquez “Rendre” le nom de votre application “Public” sur Oui.

17
Dernière étape: copiez l’ID de l’application et le secret de l’application, puis collez-les dans les champs fournis dans le module.

18

3.2.2 Comment configurer Google Login

Suivez les étapes ci-dessous pour obtenir l’identifiant client et le secret client. 1.Go pour lier “https://console.developers.google.com/project”. 2. Cliquez sur l’option déroulante mise en surbrillance dans le bouton “2” puis cliquez sur “Créer un projet”.

19

3. Entrez le nom de projet souhaité et cliquez sur “Créer”.

20
4. Allez dans API Manager, cliquez sur Create Credentials et sélectionnez l’option ID client OAuth.

21

5. Cliquez sur le bouton “Configurer l’écran de consentement”.

22

6. Entrez “Email Id”, “Nom du produit” puis cliquez sur le bouton “Enregistrer”.

23
7. Sélectionnez “application Web”, entrez “Nom”, “URI redirigé autorisés” comme indiqué ci-dessous et cliquez sur le bouton “Créer”,

24
Utiliser l’URL de redirection suivante http: //your_store_url/index.php? Fc = module & module = supercheckout & controller = supercheckout & login_type = google 8. Copier l’ID client et le secret client.

25

9. Collez ID client et secret client dans le champ de texte indiqué ci-dessous dans le panneau d’administration du module Prestashop une page.

26

Adresse de paiement 3.3

27

OpenCart One Page Checkout vous permet d’afficher ou de masquer n’importe quel champ pour l’adresse de paiement. Les champs peuvent être activés ou désactivés séparément pour les clients connectés et déconnectés. Vous pouvez marquer n’importe quel champ comme requis, différemment pour les clients connectés et déconnectés du magasin. De plus, vous pouvez réorganiser les champs d’adresse à l’aide d’un simple glisser-déposer.

Adresse d’expédition 3.4

28

Le module popup OpenCart responsive checkout vous permet d’afficher ou de masquer n’importe quel champ pour l’adresse d’expédition. Les champs peuvent être activés ou désactivés séparément pour les clients connectés et déconnectés. Avec OpenCart One Page Advanced Checkout, vous pouvez marquer n’importe quel champ de la manière requise, de manière différente pour les clients connectés et déconnectés du magasin. De plus, vous pouvez réorganiser les champs d’adresse à l’aide d’un simple glisser-déposer. Remarque: pour inclure et afficher davantage de champs personnalisés dans l’adresse de paiement, l’adresse d’expédition, la section panier ou la section compte de la commande, vous pouvez vous reporter à la section 3.10.

Méthode d’expédition 3.5

29

  • Affichage des méthodes d’expédition: Cette option affiche / masque la liste complète des méthodes d’expédition fournies sur la page de paiement avancé.
  • Style d’affichage: Avec cette option, vous pouvez sélectionner le style d’affichage pour les méthodes d’expédition. Il ne peut s’agir que d’une image de logo, d’un texte ou des deux.
  • Affichage du mode de livraison Titre: Cette option activera ou désactivera le titre pour le mode de livraison particulier.
  • Sélectionnez le mode d’expédition par défaut: Avec cette option, vous pouvez sélectionner n’importe quelle méthode d’expédition comme méthode par défaut.
  • Titre: Cette option définit le titre souhaité pour le mode d’expédition.
  • Logo: Cette option définit l’image du logo pour la méthode d’expédition.

De même, vous pouvez modifier le titre et l’image du logo pour tous les modes d’expédition en utilisant cette option.

3.6 Ship2Pay

30

Méthode de paiement 3.7

31

  • Afficher les modes de paiement: Cette option affichera / cachera la liste complète des méthodes de paiement fournies sur la page de paiement avancé.
  • Style d’affichage: Avec cette option, vous pouvez sélectionner le style d’affichage pour les méthodes de paiement. Il ne peut s’agir que d’une image de logo, d’un texte ou des deux.
  • Sélectionnez le mode de paiement par défaut: Avec cette option, vous pouvez sélectionner n’importe quel mode de paiement comme méthode par défaut.
  • Titre: Cette option définit le titre souhaité pour le mode de paiement.
  • Logo: Cette option définit l’image du logo pour le mode de paiement.

De même, vous pouvez modifier le titre et l’image du logo pour tous les modes de paiement à l’aide de

3.8 Cart

Dans cette section d’OpenCart One Page Supercheckout, vous pouvez personnaliser le panier et l’afficher comme vous le souhaitez dans votre magasin. La taille d’image des éléments du panier peut être facilement modifiée en définissant la hauteur et la largeur de l’image.

32

  • Taille de l’image du produit: Cette option vous permet de définir la taille de l’image pour les produits affichés dans la section panier de la page de paiement. De plus, vous pouvez afficher ou masquer les différents champs du panier permettant aux clients connectés et déconnectés du magasin. Des champs tels que “Accepter les conditions” et le commentaire de commande peuvent être marqués comme facultatifs ou facultatifs selon les exigences de votre site.

Bulletin d’information 3.9

33

  • Activer MailChimp: Cette option de supercheckout d’une page Opencart vous permet d’activer ou de désactiver la fonctionnalité d’intégration MailChimp pour votre magasin.
  • Clé de l’API MailChimp: Avec cette option, vous pouvez définir la clé de l’API MailChimp qui connectera votre site au compte MailChimp du vendeur.
  • Liste MailChimp: En utilisant cette option, vous pouvez récupérer et sélectionner la liste particulière connectée au compte MailChimp.

3.9.1 Comment configurer MailChimp

1.Connectez-vous à votre compte Mail Chimp. 2.Cliquez sur l’onglet du coin droit> Choisissez Profil> Extras> Clés API. 3.Here Admin peut créer une clé API en cliquant sur le bouton “Créer une clé”. 4.Copiez la clé API. 5.Admin peut également créer une liste différente pour chaque client de connexion sociale en cliquant sur “Liste” dans la barre de menus supérieure. 6.Now Collez la clé de l’API dans la section Clé de l’API fournie au chimpanzé et cliquez sur le bouton “Obtenir la liste”. 7.Sélectionnez la liste dans le menu déroulant.

3.10 Comment ajouter ou modifier des champs personnalisés à la page Supercheckout

Afin d’ajouter des champs personnalisés à toute section de One Page Checkout, vous pouvez accéder à l’option “Champs personnalisés” de l’onglet “Clients” dans la partie gauche de l’interface d’administration.

34


Joe Parker

We boast of the best in the industry plugins for eCommerce systems and has years of experience working with eCommerce websites. We provide best plugins for platforms like - Magento, Prestashop, OpenCart and Shopify . We also provide custom module development and customization services for the website and modules..

Leave a Reply

Your email address will not be published. Required fields are marked *