Avec la croissance de l’industrie du commerce électronique et des applications mobiles, les entreprises en ligne connaissent des changements majeurs. Les derniers changements technologiques sont en mesure de fournir une expérience d’achat agréable aux clients et contribuent également à augmenter les ventes et les revenus. La Progressive Web App est l’une de ces technologies qui est connue pour sa réactivité, son chargement rapide, son installation rapide et d’autres fonctionnalités intéressantes. De plus, l’eCommerce PWA Mobile App Builder permet à l’administrateur du magasin de transformer facilement le magasin de commerce électronique en Progressive Web App. Le Knowband PWA Mobile App Maker pour le commerce électronique est un plugin prêt à l’emploi pour lancer une application de magasinage en vedette. L’extension donne une expérience native de type application dans l’application mobile PWA sans aucune connaissance technique. L’administrateur du magasin peut gérer toutes les modifications et configurations à partir du backend du module. Les modifications seront automatiquement répercutées sur l’application mobile PWA de commerce électronique en direct. C’est une application très légère qui peut fonctionner de manière transparente et fluide sur n’importe quel appareil.
[NOUVELLE MISE À JOUR] Fonctionnalité RTL dans les applications mobiles KnowBand PWA:
La langue joue un rôle important pour capter l’attention de l’utilisateur et améliorer l’expérience d’achat. Mais, de nombreuses applications mobiles de commerce électronique ne peuvent pas cibler un vaste public mobile en raison de la barrière de la langue. Pour cibler le marché au niveau régional et mondial, l’administrateur du magasin a juste besoin d’ajouter sa langue maternelle sur le site Web et Progressive Web App.Avec PWA Mobile App Maker, il devient très pratique de lancer l’application Web Progressive pour la boutique de commerce électronique. L’administrateur du magasin peut ajouter plusieurs langues sur l’application mobile PWA, y compris les langues RTL telles que l’arabe, l’hébreu, le persan, etc. L’application Web Progressive prend en charge toutes les langues disponibles sur le site Web de commerce électronique. Cela permet de cibler facilement le public de différentes régions et d’élargir la portée de l’entreprise. Désormais, l’administrateur du magasin peut inclure plus de langues sur l’application autres que le site Web. Voici quelques-uns des écrans montrant à quoi ressembleront les écrans RTL:
Qu’est-ce que PWA Mobile App Builder et comment fonctionne-t-il?
Le créateur d’applications Web progressives offre une excellente expérience client aux utilisateurs et il s’agit d’un plugin logiciel prêt à l’emploi qui permet à l’administrateur du magasin d’effectuer toutes les personnalisations. Tous les changements sont effectués avec quelques ajustements de la souris dans le panneau d’administration sans aucune connaissance en codage. Une fois que le site Web de commerce électronique a été intégré à Progressive Web App Builder, toutes les données / inventaire du site Web de commerce électronique seront automatiquement récupérées sur l’application mobile. L’utilisateur peut facilement installer la Progressive Web App en accédant simplement à l’URL du magasin sur le navigateur mobile. Knowband propose l’application mobile PWA pour toutes les principales plates-formes telles que PrestaShop, Magento 2, WooCommerce, OpenCart. Vérifiez plus de détails à partir des liens ci-dessous:
Autres fonctionnalités clés du créateur d’applications Web progressives:
Voici quelques points à prendre en compte dans votre Progressive Web App avant de vous lancer. Ces fonctionnalités aident l’entreprise de commerce électronique à booster la conversion.
1. Branding facile avec option de personnalisation:
L’option de marque dans l’application mobile eCommerce PWA consiste en un logo d’application, un nom de marque, une icône, une image, un écran de démarrage, une couleur d’arrière-plan, etc. Cela permet à l’administrateur du magasin d’établir l’identité de la marque dans l’esprit des clients utilisant PWA Mobile App. De mauvaises stratégies de marque peuvent entraîner une baisse du trafic et réduire le taux de conversion. L’ensemble de l’aspect de la disposition de l’écran d’accueil, de la couleur, de la police, etc. peut être facilement modifié à partir du panneau d’administration du module. Le bon ensemble de bannières, d’images et de texte peut améliorer l’interface et les conversions de l’application.
2. Compatible tablette et mobile:
L’application Web progressive de commerce électronique ne dépend pas de la plate-forme ou de l’appareil et est très légère. L’application de commerce électronique peut fonctionner en douceur sur Android / iOS et mobile / tablette et s’adapter facilement à tous les appareils de taille multi-écran.
3. Connexion et paiement en un clic:
Le PWA Mobile App Builder se compose d’options de connexion en un clic avec Facebook et Google. Les options de connexion et d’enregistrement intégrées telles que Google et Facebook et le courrier électronique permettent aux utilisateurs d’accéder facilement à l’application mobile PWA. L’application d’achat de commerce électronique permet aux clients de ne remplir que les informations nécessaires lors de l’exécution des transactions. Cela leur donne l’avantage d’une caisse simplifiée. Cette option empêche le client de s’irriter et offre un processus de transaction fluide.
4. Prise en charge de toutes les méthodes de paiement et d’expédition:
Pour gagner la confiance et la fiabilité des clients, l’administrateur du magasin peut utiliser plusieurs options de paiement et d’expédition dans l’application mobile PWA. Toutes les options de paiement et d’expédition disponibles sur le site de commerce électronique peuvent être ajoutées à la Progressive Web App. Les clients peuvent facilement faire leurs achats parmi les options de paiement et d’expédition les plus préférées.
5. Synchronisation en temps réel:
La fonction de synchronisation en temps réel récupère automatiquement l’inventaire des produits et les données du site Web de commerce électronique dans l’application mobile. L’administrateur du magasin peut facilement mettre à jour l’inventaire des applications à partir du site Web sans avoir à redoubler d’efforts manuels.
6. Application légère avec chargement rapide:
L’application PWA est très légère et se charge rapidement que les applications natives. Progressive Web App Builder garantit des performances rapides de l’application et la fait fonctionner en douceur sur tous les appareils et plates-formes. Les utilisateurs n’ont pas à dépendre du Play Store et de l’App Store pour installer l’application mobile de commerce électronique.
7. Prend en charge le mode hors ligne:
Le générateur d’applications mobiles eCommerce PWA se compose d’un cache de données précédemment chargées. Il montre les données aux utilisateurs même s’ils ne sont pas connectés à Internet. L’utilisateur utilise facilement l’application d’achat et ajoute des produits à sa liste de souhaits et à son panier.
8. Options de chat Zopim et Whatsapp:
Progressive Web App Maker se compose de fonctionnalités Zopim et Whatsapp Chat qui aident à résoudre les requêtes et les problèmes des clients. Le support client est disponible 24h / 7 et XNUMXj / XNUMX pour les acheteurs mobiles. La fonctionnalité permet à l’utilisateur de se connecter avec l’administrateur du magasin chaque fois que nécessaire.
Conclusion:
Ce blog comprend des fonctionnalités de eCommerce PWA Mobile App Builder qui garantissent des performances rapides et un canal d’achat fiable pour votre audience mobile.Une telle application mobile PWA peut donner un coup de pouce et un avantage concurrentiel à l’entreprise. Les fonctionnalités exceptionnelles du plugin ready-made aident à obtenir un bon taux de conversion et des ventes auprès du public mobile. Vous pouvez nous joindre au support@knowband.com en cas de questions.
L’application PWA Mobile pour le commerce électronique est conçue et développée pour faciliter la tâche de l’administrateur du magasin en possédant une application d’achat. Les propriétaires de magasins peuvent désormais facilement transformer la boutique en ligne en Progressive Web App. L’application Web progressive est l’une des technologies les plus pertinentes pour lesquelles chaque administrateur de magasin de commerce électronique devrait opter. Il offre des fonctionnalités étonnantes dans l’application mobile telles que le mode hors ligne, des options de personnalisation faciles, l’indépendance de la plate-forme, les notifications push, etc.
Knowband est une entreprise renommée, particulièrement connue pour le développement de plugins prêts à l’emploi pour les sites Web de commerce électronique. Nous avons développé des plugins de commerce électronique pour différentes plates-formes comme OpenCart, PrestaShop, Magento 2, WooCommerce. Une telle extension est Générateur d’applications mobiles PWA. Cette solution prête à l’emploi permet à l’administrateur du magasin de rendre leur site Web PWA actif et les clients obtiendront «Ajouter l’application PWA à l’écran d’accueil» pour installer et accéder à l’application d’achat.
Notes importantes de l’application mobile PWA pour travailler sur les appareils iOS:
Il y a eu de nombreux mythes et confusions dans l’industrie du commerce électronique sur le fonctionnement des applications mobiles PWA sur les appareils iOS comme l’iPhone, l’iPad, etc. Voici quelques-uns des principaux pour clarifier le concept:
1. Les appareils iOS n’autorisent pas l’invite “Ajouter à l’écran d’accueil”
Le PWA Mobile App Builder permet au client d’ajouter facilement l’application mobile à l’écran d’accueil de son appareil sans y accéder depuis l’App et le Play Store. Une fois que l’URL de la boutique est ouverte sur le navigateur mobile, une invite s’affiche avec “Ajouter à l’écran d’accueil”. Cette fonctionnalité fonctionne correctement sur Android à partir de maintenant. Les utilisateurs de l’application iOS doivent ajouter manuellement l’application Web progressive sur l’iPhone / iPad car iOS n’offre pas de fenêtre contextuelle intégrée «Ajouter à l’écran d’accueil».
2. Les notifications Web Push ne fonctionnent pas sous iOS
La notification push est l’un des meilleurs outils de marketing de eCommerce PWA Mobile App Builder. La fonction de notification push de l’eCommerce PWA Mobile App Maker est très utile pour envoyer des mises à jour sur les remises, les offres et les taux d’abandon de panier aux acheteurs mobiles. L’administrateur du magasin peut facilement configurer et envoyer des notifications push aux utilisateurs d’Android, mais à partir de maintenant, cette option n’est pas disponible pour les utilisateurs iOS.
Qu’est-ce que PWA Mobile App Builder et comment fonctionne-t-il?
Progressive Web App Maker est une technologie Web moderne qui offre une expérience de type application native via une application Web. Il s’agit d’un plugin logiciel prêt à l’emploi qui convertit votre boutique de commerce électronique en une application Web progressive sans aucune connaissance en codage. De plus, l’administrateur du magasin peut bénéficier de tous les avantages de l’application de commerce électronique dans l’application Web progressive. L’activation de l’application mobile PWA sur les appareils mobiles permet à l’administrateur du magasin de gagner du temps et de l’argent et est livré avec des options de personnalisation faciles.
Une fois le site Web converti en application mobile PWA, chaque fois qu’un utilisateur ouvre l’URL de la boutique sur le navigateur mobile, la fenêtre contextuelle «Ajouter à l’écran d’accueil» apparaîtra. L’application Web progressive sera simplement ajoutée à l’appareil mobile et la même chose sera accessible à tout moment pour parcourir ou acheter des produits.
Knowband propose le PWA Mobile App Maker pour toutes les principales plates-formes telles que PrestaShop, Magento, WooCommerce, OpenCart. Consultez les liens ci-dessous pour plus d’informations:
Autres fonctionnalités clés de PWA Mobile App Builder (sur Android et iOS)
Certaines fonctionnalités clés de la Progressive Web App sont disponibles sur les appareils Android et iOS. Nous en avons mentionné quelques-uns dans cette section:
1. Image de marque avec personnalisation de l’écran d’accueil:
La marque est l’une des parties les plus importantes de toute entreprise de commerce électronique, car elle donne une identité à la marque de commerce électronique dans l’esprit des clients. L’administrateur du magasin peut également tirer parti de la stratégie de marque appropriée en ajoutant le logo de la marque, le nom de la marque, l’icône, l’image, l’écran de démarrage, la couleur d’arrière-plan, etc. dans Progressive Web App. Tous ces changements peuvent être facilement effectués en accédant au backend du module.
L’application mobile PWA se compose de plusieurs options de personnalisation efficaces à partir desquelles l’administrateur du magasin peut modifier l’apparence et la convivialité de l’application sans aucune modification du codage technique. La PWA pour le commerce électronique permet à l’administrateur du magasin d’effectuer les modifications même si l’application est en ligne. L’administrateur du magasin peut modifier les bannières, les images, les curseurs, les couleurs intuitives et la police, etc., et concevoir la disposition de l’écran d’accueil à partir du panneau d’administration.
2. Compatible tablette et mobile:
L’application mobile eCommerce PWA est très légère et peut facilement être compatible avec tous les appareils. L’application Web progressive de commerce électronique n’est pas dépendante de la plate-forme ou de l’appareil et peut fonctionner en douceur sur Android ou iOS et mobile ou tablette.
3. Connexion et paiement en un clic:
La plupart des applications mobiles de commerce électronique ne sont pas en mesure de fournir l’option de connexion et de paiement facile qui peut entraîner un taux d’abandon de panier élevé. Le PWA Mobile App Builder offre une solution de connexion en un clic avec Google et Facebook. L’administrateur du magasin peut activer les options de connexion sociale et la connexion / inscription par e-mail. Le processus de commande simple permet aux clients de remplir les informations nécessaires pour terminer les transactions. Cette option permet uniquement aux utilisateurs de remplir les informations pertinentes pour terminer la commande dans l’application mobile PWA.
4. Prise en charge de toutes les méthodes de paiement et d’expédition:
L’administrateur du magasin peut également inclure le paiement multiple et l’expédition dans le Application mobile de commerce électronique PWA disponible sur le site e-commerce. Le client peut facilement magasiner avec son paiement le plus préférable et le mode d’expédition. Les options de paiement et d’expédition fiables améliorent la confiance des clients et les incitent à acheter davantage.
5. Prise en charge des langues multilingues et RTL:
L’application mobile eCommerce PWA prend en charge toutes les langues disponibles sur le site Web de commerce électronique. L’application Web progressive permet également à l’administrateur du magasin d’ajouter plusieurs langues, y compris des scripts RTL (de droite à gauche) comme l’arabe, l’hébreu, le persan, etc. Le marchand de commerce électronique peut inclure les langues en fonction de la région cible et des besoins des utilisateurs. Les acheteurs mobiles doivent simplement sélectionner la langue dans l’application de commerce électronique et elle sera traduite en conséquence.
6. Synchronisation en temps réel:
La synchronisation en temps réel garantit que tout l’inventaire de produits et les données du site Web de commerce électronique seront automatiquement récupérés dans l’application d’achat. Si des modifications sont apportées à l’inventaire du magasin, elles seront également reflétées dans l’application Web progressive de commerce électronique frontale. Cela élimine les efforts manuels de l’administrateur du magasin et fait gagner beaucoup de temps.
7. Application légère avec chargement rapide:
Le PWA Mobile App Builder est très léger et offre des performances rapides si nous le comparons aux applications natives. L’application mobile Progressive permet au client de l’installer sans se soucier de l’espace dans les téléphones mobiles. L’application PWA ne dépend pas non plus du Play Store et de l’App Store. L’utilisateur peut l’installer directement à partir du site Web de commerce électronique.
8. Prend en charge le mode hors ligne:
Le mode hors ligne de l’application mobile PWA permet aux utilisateurs d’accéder à l’application mobile de commerce électronique sans Internet. Le cache des écrans précédemment chargés apparaît sur Progressive Web App. Cette option permet à l’utilisateur d’utiliser facilement l’application mobile, même s’il est confronté à des problèmes Internet.
9. Options de chat Zopim et Whatsapp:
Progressive Web App Builder fournit une fonction de chat pratique aux acheteurs mobiles. Les utilisateurs peuvent se connecter directement à l’administrateur du magasin concernant leurs questions, problèmes et confusion et obtenir des réponses via le chat. L’administrateur du magasin peut apporter des solutions instantanées à leurs préoccupations. Cette fonctionnalité permet à l’utilisateur de se connecter à tout moment à l’administrateur du magasin et d’obtenir l’assistance requise.
10. Compatible avec le marché multifournisseur:
Le créateur d’applications Web progressives est également compatible avec le marché multi-fournisseurs. Le plug-in de la place de marché multi-fournisseurs permet à l’administrateur du magasin d’enregistrer facilement le vendeur en prenant certaines informations requises. Il permet aux vendeurs de s’inscrire sur le marché Web et le même sera récupéré sur l’application eCommerce PWA avec leur profil et leurs produits.
Ici, dans cet article, nous avons essayé de couvrir toutes les préoccupations liées à l’application mobile PWA et à la plate-forme iOS. Parallèlement à cela, nous avons essayé de réduire toutes les fonctionnalités exceptionnelles du plugin prêt à l’emploi PWA Mobile App Builder. IC’est l’option la plus pratique pour amener votre entreprise sur la plate-forme mobile et vous aider à atteindre l’objectif que vous recherchez.
Pour en savoir plus sur l’application mobile PWA, contactez-nous à support@knowband.com.
Ce plugin prêt à l’emploi est conçu et développé par KnowBand pour convertir votre boutique WooCommerce en cours d’exécution en une application Web progressive riche en fonctionnalités. Une fois la boutique de commerce électronique transformée en application PWA, chaque fois qu’un utilisateur ouvre l’URL de la boutique dans le navigateur mobile, la personne concernée sera invitée à “Ajouter PWA à l’écran d’accueil”. Une fois l’application mobile WooCommerce PWA ajoutée à l’écran d’accueil de l’appareil mobile, l’utilisateur peut parcourir le magasin sur l’application comme n’importe quelle autre application. L’application mobile WooCommerce PWA est une application Web qui ne repose pas sur la publication d’applications sur Google Play et Apple App Store. Les utilisateurs peuvent simplement ajouter l’application Web progressive à l’appareil mobile et l’utiliser comme n’importe quelle autre application.
1.1 Fonctionnalités convaincantes pour choisir WooCommerce PWA :
– Chargement plus rapide et performances rapides – Écran d’accueil entièrement personnalisable avec l’éditeur de bricolage – Prise en charge de toutes les méthodes d’expédition et de paiement du site Web – Interface conviviale engageante – Aucune dépendance aux magasins d’applications – Entièrement personnalisé pour votre magasin – Connexion par e-mail et réseaux sociaux (Google et Facebook ) – Prise en charge multilingue et RTL – Fonctionnement en mode hors ligne – Synchronisation en direct du site Web et de l’application – Compatible Android et iOS – Paiement d’une page – Application légère – Gestion des pages CMS
1.2 Voir la démo WooCommerce PWA
Explorez les fonctionnalités du module et de l’application PWA à partir des liens de démonstration ci-dessous:
�> Les appareils iOS n’offrent aucune invite “Ajouter à l’écran d’accueil” intégrée, les utilisateurs doivent donc ajouter manuellement l’application mobile PWA à l’écran d’accueil de l’iPhone ou de l’iPad. �> iOS ne prend pas en charge les notifications push Web. Par conséquent, les notifications push ne seront pas reçues sur la PWA installée sur l’iPhone ou l’iPad.
[NOUVELLE MISE À JOUR]�WooCommerce�PWA prend en charge les scripts de langage RTL :
Le créateur de l’application Web progressive WooCommerce prend désormais en charge toutes les langues du monde, y compris celles RTL (de droite à gauche) telles que l’arabe, l’hébreu, le persan, etc. L’administrateur du magasin peut désormais même ajouter des langues RTL sur l’application mobile WooCommerce PWA.
2.0 Écrans du panneau d’administration:
Explorez tous les paramètres sous le panneau d’administration de l’application mobile WooCommerce PWA et vérifiez leur fonctionnement à l’aide des captures d’écran détaillées ci-dessous :
Paramètres généraux 2.1:
a) Afficher / masquer l’aperçu: Appuyez sur le bouton œil pour afficher / masquer l’aperçu du téléphone dans le panneau d’administration. b) Activer/Désactiver : Activez le module pour que PWA fonctionne sur les appareils mobiles. c) Activer le rapport du journal des demandes: Activez le journal des erreurs sur mobile. d) Rediriger sur la page du panier lors de l’ajout au panier : Contrôlez la redirection du bouton Ajouter au panier chaque fois qu’un utilisateur appuie sur le bouton Ajouter au panier. e) Afficher une courte description : Activez et affichez une courte description du produit (si ajouté sur la page produit du site Web). f) Afficher la fenêtre contextuelle Ajouter à l’écran d’accueil : Offrez un message contextuel “Ajouter à l’écran d’accueil” et autorisez les utilisateurs à ajouter l’application PWA sur les appareils mobiles. g) Activer le logo : Ajoutez le logo de votre marque sur l’en-tête de l’application mobile WooCommerce PWA.
h) Couleur d’arrière-plan de l’écran de démarrage : Choisissez et définissez la couleur de l’écran de démarrage de l’application Web progressive WooCommerce. i) Nom de l’application PWA : Entrez le nom souhaité pour l’application WooCommerce PWA. Il sera affiché une fois que l’utilisateur aura ajouté l’application sur les appareils mobiles. j) Image pour l’icône de l’application : Ajouter une image d’icône d’application dans le panneau d’administration. k) Sélectionnez la police de l’application : Choisissez la police de votre application mobile WooCommerce PWA. l) Sélectionnez Disposition pour la page d’accueil : Choisissez parmi la disposition d’écran d’accueil pré-ajoutée pour l’application WooCommerce PWA.
m) Couleur du bouton de l’application : Choisissez la couleur du bouton pour l’application mobile PWA. n) Couleur du thème de l’application : Choisissez la couleur du thème pour l’application PWA. o) Couleur d’arrière-plan de l’application : Choisissez la couleur d’arrière-plan de l’application PWA. p) Activer la barre d’onglet : Activez la barre d’onglets en bas de l’application PWA pour une navigation rapide et facile. q) CSS personnalisé : Entrez le code CSS pour améliorer l’apparence des pages Web de l’application PWA, telles que le paiement Web, les pages CMS, etc.
Paramètres de notifications push 2.2
Les notifications push sont le meilleur outil marketing pour l’application PWA pour WooCommerce. L’administrateur du magasin peut simplement promouvoir les produits et les offres du magasin auprès des utilisateurs de l’application et générer plus de ventes et de revenus. Saisissez tous les détails dans les paramètres de notification push en créant un projet Firebase :
Comment créer un compte Firebase?
Étape 1 : Connectez-vous à Google Firebase
Étape 2 : Créer un nouveau projet Lorsque vous cliquez sur Ajouter un projet, la boîte de dialogue suivante apparaîtra:
La création du projet prendra quelques secondes. Une fois le projet prêt, cliquez sur Continuer.
Étape 3 : Gérer les paramètres du projet Une fois le projet créé, cliquez sur Paramètres du projet.
Étape 4 :Aller aux options d’authentification:
Étape 5 : Trouver les clés Firebase Dans les paramètres du projet, cliquez sur Paramètres de messagerie Cloud. De là, vous pouvez directement obtenir la clé du serveur.
Étape 6 : Ajoutez votre application Web à Firebase
Étape 7 :“ Obtenez d’autres détails relatifs à Firebase et collez-les dans le panneau d’administration du module PWA.
Étape 8 :Obtenez la clé du serveur Firebase à partir de l’onglet de messagerie cloud dans Paramètres:
Étape 9 :Ajoutez votre domaine dans l’authentification >> connectez-vous.
A) Notification push de commande réussie:
Activez / désactivez la notification push automatisée à envoyer aux utilisateurs de l’application chaque fois qu’ils passent une commande réussie à partir de l’application WooCommerce PWA.
B) Notification push de mise à jour de l’état de la commande:
Activer / désactiver la notification push automatisée envoyée chaque fois que l’état de la commande de l’application est mis à jour. Les utilisateurs de l’application mobile WooCommerce PWA peuvent garder un œil sur les détails des commandes précédentes.
C) Notification push de panier abandonné:
Activer / désactiver la notification push automatique envoyée aux utilisateurs abandonnant des produits dans le panier sans achat réussi. Cette notification push sera envoyée aux utilisateurs automatiquement après l’intervalle de temps entré.
2.3 Historique des notifications push
L’historique complet des notifications push des notifications push envoyées avec succès s’affiche ici. L’administrateur du magasin peut garder une trace des notifications push précédemment envoyées à partir d’ici.
A) Envoyer une notification:
Personnalisez et envoyez manuellement une notification push aux utilisateurs de l’application PWA selon les besoins. L’administrateur du magasin peut configurer lui-même ces notifications et les envoyer aux utilisateurs de l’application WooCommerce PWA.
Mise en page de la page d’accueil 2.4:
L’application mobile WooCommerce PWA offre un écran d’accueil personnalisable dont la disposition peut être conçue à partir du panneau d’administration en quelques clics de souris et glisser-déposer. La mise en page attrayante selon le festival en cours, la vente, l’occasion, etc. peut certainement aider à améliorer les ventes via les applications mobiles WooCommerce PWA.
Ajoutez une nouvelle mise en page à partir de cet onglet ou modifiez celles ajoutées précédemment. Les paramètres de configuration de la page d’accueil proposent les éléments suivants :
a) Principales catégories :�
b) Bannière carrée :�
c) Bannière coulissante horizontale :�
d) Bannières de grille :�
e) Bannière du compte à rebours :�
f) Produits Carrés :�
g) Produits coulissants :�
h) Produits de réseau :�
Pages d’informations 2.5:
Ajoutez des pages CMS sur l’application et offrez un contenu informatif aux utilisateurs de l’application mobile WooCommerce PWA.
Comment obtenir les détails de l’application Facebook?
L’application Facebook peut être créée en suivant les étapes ci-dessous: –
Étape 1 :Aller à l’URL donnée: https://developers.facebook.com/apps/
Étape 2 :Cliquez sur le bouton “Ajouter une nouvelle application”.
Étape 3 et 4:Entrez le nom de votre application et votre adresse e-mail, puis cliquez sur le bouton “Créer un identifiant d’application”.
Étape 5 et 6:Après avoir cliqué sur Créer un identifiant d’application, vous devrez effectuer un contrôle de sécurité comme indiqué:
Étape 7 :Cliquez sur l’onglet “Paramètres”.
É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é», «Termes et conditions» URL »,« Ajouter un logo »,« Sélectionner une catégorie »et cliquez sur le bouton« Enregistrer les modifications ». Domaines d’application: yourdomain.com est correct yourdomain.com/store is incorrect www.domain.com is incorrect
Étape 14 :Maintenant, cliquez sur “+ Ajouter une plate-forme”.
Étape 15: Et sélectionnez Site Web comme plate-forme.
Étape 16 :Maintenant, entrez l’URL de votre site.
Étape 17 et 18:Cliquez sur “Produits +” et sélectionnez Connexion Facebook.
Étape 19 :Sélectionnez Web comme plate-forme pour l’application.
Étape 20 :“ Maintenant, cliquez sur Enregistrer.
Étape 21 et 22: Cliquez sur Paramètres et ajoutez un URI de redirection OAuth valide. URI de redirection OAuth valides: https://example.com/pwa-app/login
Étape 23 et 24:Cliquez sur “Revue de l’application”. Et marquez «Rendre le nom de votre application public» sur Oui.
Dernière étape:Copiez l’ID de l’application et le secret de l’application et collez-les dans les champs fournis dans le module.
Comment obtenir les détails de l’application Google?
Accédez à Google Developers Console (https://console.developers.google.com/project) ou cliquez sur le lien en haut à droite de l’onglet correspondant dans la page de configuration du module.
Cliquez maintenant sur Créer un projet à gauche de la page.
Saisissez un nom pour votre projet et passez à l’étape suivante.
Cliquez maintenant sur API et auth-> Credentials dans le menu de gauche comme indiqué ci-dessous.
Cliquez sur le bouton Créer un nouvel ID client dans le panneau de droite de l’écran.
Vous devrez peut-être remplir le formulaire pour l’écran de consentement avant de continuer. Pour ce faire, vous devez cliquer sur Écran de consentement dans le menu de gauche, comme indiqué dans l’image ci-dessus.
Remplissez le formulaire avec les détails ci-dessous:
Type d’application: Application Web. Origines JavaScript autorisées: Le nom de domaine de votre boutique (https://www.yourstore.com). URI de redirection autorisée ou URI de la page de redirection de Loginizer:
https://example.com/pwa-app/login
Maintenant, cliquez sur le bouton Créer un ID client pour obtenir votre ID client et votre clé secrète client.
Vous pouvez désormais utiliser le secret client et l’ID client pour permettre à vos clients de se connecter à votre boutique à l’aide de leur compte Google.
Écrans PWA frontaux 3.0 :
Écran d’accueil 3.1:
L’écran d’accueil de l’application mobile WooCommerce PWA est entièrement personnalisable avec l’éditeur DIY, comme expliqué ci-dessus dans les écrans du panneau d’administration. Changez l’apparence de l’écran d’accueil de l’application à tout moment et offrez une apparence plus conviviale et axée sur les ventes.
1. Disposition personnalisée:
À l’aide de divers bannières, curseurs et éléments de produit, l’administrateur du magasin peut créer une mise en page dynamique selon les besoins.
2. Logo de la marque:
Utilisez le logo de votre boutique dans l’en-tête supérieur de l’application WooCommerce PWA.
3. Sac de panier:
L’icône du panier dans le coin supérieur droit de l’écran d’accueil permet aux utilisateurs d’accéder à l’écran du panier et de vérifier les produits ajoutés.
4. Menu de navigation de gauche:
Parcourez les catégories affichées dans l’application PWA avec la navigation dans le menu de navigation à gauche.
3.2 Menu accordéon (barre de navigation) :
Les applications mobiles WooCommerce PWA sont livrées avec une catégorisation transparente et appropriée disponible. Les utilisateurs peuvent trouver les catégories pertinentes dans le menu de navigation de gauche et parcourir les produits. Diverses pages CMS peuvent également être ajoutées dans le menu offrant un contenu pertinent sur l’application.
1. Mon compte
L’option Mon compte contient toutes les informations personnelles des utilisateurs, y compris l’expédition et la commande. Les acheteurs de l’application Web progressive WooCommerce peuvent afficher et mettre à jour les informations enregistrées.
2. Les catégories
Les catégories affichées dans le menu de navigation de gauche de l’application Web progressive WooCommerce sont les mêmes que celles disponibles sur la boutique de commerce électronique.
3. Pages CMS
Diverses pages CMS telles que À propos de nous, Contactez-nous, Conditions générales, etc. sont accessibles à partir d’ici. Ces pages d’informations peuvent être ajoutées à partir du panneau d’administration de l’extension.
4. Langue (s)
L’option de langue permet aux utilisateurs de l’application PWA d’afficher l’application Web dans la langue de leur choix.
5. Monnaie (s)
Toutes les devises disponibles sur votre site Web sont affichées ici sur l’application WooCommerce PWA.
6. Connexion / Déconnexion
Les utilisateurs peuvent facilement se connecter/se déconnecter de l’application WooCommerce PWA via cette option.
Écran de catégorie 3.3:
Des écrans de catégorie sans encombrement avec la liste et la vue en grille permettent aux utilisateurs de choisir ce qui leur convient le mieux dans une catégorie spécifique. L’ensemble de l’inventaire du magasin restera synchronisé avec l’application mobile WooCommerce PWA et les nouveaux ajouts et modifications seront même mis à jour en temps réel.
1. Vue Liste et Grille:
Les catégories de l’application PWA pour WooCommerce peuvent être parcourues à la fois en mode liste et en mode grille.
2. Tri des produits:
L’option de tri permet aux acheteurs en ligne d’affiner les produits dans l’ordre de tri souhaité et de trouver le bon.
3. Filtre de produit:
L’application mobile WooCommerce PWA offre la possibilité de filtrer les produits en simplifiant la recherche de produits. Les acheteurs en ligne peuvent trouver les produits souhaités dans des catégories en utilisant des filtres pour divers attributs tels que la taille, la couleur, le prix, etc.
Écran de produit 3.4:
L’écran du produit de l’application Web progressive WooCommerce est aussi simple et intrigant que possible. Avec toutes les options et informations nécessaires sur le produit, il suffit de quelques minutes pour que les utilisateurs soient sûrs du produitqu’il est sur le point d’acheter. Plusieurs images sont disponibles pour le produit avec les options En stock et En rupture de stock.
1. Informations sur le produit et entretien:
Les informations complètes sur le produit disponibles dans l’inventaire seront affichées ici.
2. Brève description:
Les utilisateurs peuvent lire la brève description de votre produit pour se faire une opinion rapide sur l’achat.
3. Options du produit:
Toutes les options liées au produit comme la taille, la couleur, etc. sont affichées ici.
5. Ajouter au panier:
Ce bouton permet aux utilisateurs d’ajouter des produits dans le panier. Les utilisateurs peuvent en outre traiter le panier pour l’achat.
6. Partage social de produit:
L’option de partage du produit permet aux utilisateurs de partager des produits sur plusieurs canaux sociaux.
Écran de connexion 3.5
L’application mobile WooCommerce PWA offre des options de connexion sociale en un clic et rend le processus de connexion/inscription plus transparent. L’application Web progressive WooCommerce offre une connexion Google et Facebook.
1. S’identifier:
Les utilisateurs de l’application peuvent facilement s’authentifier et se connecter aux applications PWA en utilisant leurs identifiants de connexion par e-mail précédents.
2. Inscrivez-vous:
Tous les nouveaux utilisateurs de l’application peuvent s’inscrire et créer leur compte sur la boutique à partir de l’application WooCommerce PWA. Le formulaire d’inscription ne demande que les détails nécessaires pour créer un compte.
3. Connectez-vous avec Facebook:
Les utilisateurs peuvent se connecter à l’application PWA en utilisant leurs identifiants de compte Facebook.
4. Connectez-vous avec Google:
Les utilisateurs peuvent se connecter à l’application PWA en utilisant leurs identifiants de compte Google.
Écran du panier d’achat 3.6:
L’écran Panier de l’application mobile WooCommerce PWA affichera tous les produits ajoutés au panier. Les utilisateurs de l’application peuvent voir le nom du produit, la quantité, le prix total et les frais d’expédition. Cet écran propose les options suivantes :
1. Appliquer le bon:
Cette option permet aux utilisateurs d’utiliser des coupons de site Web et de profiter d’offres de réduction.
2. Prix total du produit:
Les utilisateurs peuvent voir le coût total de leur panier avant de continuer. Il est automatiquement mis à jour en fonction de toute mise à jour avec quantité de produit ou nouvel ajout.
3. Mettre à jour la quantité de produit:
Les utilisateurs de l’application PWA peuvent même mettre à jour la quantité de produit avec l’option “Mettre à jour la quantité”.
4. Supprimer le produit:
Les utilisateurs de l’application peuvent simplement supprimer le produit du panier en appuyant simplement sur l’option «Supprimer».
5. Continuez vos achats:
Les utilisateurs de l’application peuvent quitter le panier pour parcourir plus de produits sur votre application.
6. Continuez à payer:
Les utilisateurs de l’application PWA peuvent continuer vers les écrans de paiement et de paiement en appuyant simplement sur l’option “Continuer à payer”.
Écran de paiement 3.7
L’application Web progressive pour WooCommerce propose un paiement simplifié sur un seul écran avec uniquement les informations pertinentes. Les utilisateurs de l’application peuvent afficher les détails complets de la commande tels que les détails d’expédition, les détails de facturation, le récapitulatif de la commande, le commentaire de la commande, le récapitulatif du paiement.
1. Détails d’expédition et de facturation:
Cet écran fournit des détails sur les adresses de livraison et de facturation enregistrées par l’utilisateur. L’utilisateur peut également modifier / enregistrer la nouvelle adresse de livraison si nécessaire.
2. Récapitulatif de la commande:
Les utilisateurs de l’application peuvent consulter les détails du produit avant d’effectuer le paiement.
3. Méthodes d’expédition:
Toutes les méthodes d’expédition disponibles sont affichées ici. Les utilisateurs peuvent choisir celui qui convient à leurs besoins.
4. Commentaire de la commande:
Les utilisateurs peuvent également ajouter tout commentaire lié à leur commande qui sera visible pour stocker l’administrateur sur la page Web de la commande dans le backend.
5. Récapitulatif du paiement:
Cette section affiche les détails de paiement détaillés impliqués dans l’achat.
6. Procéder au paiement:
Les utilisateurs de l’application PWA seront redirigés vers l’écran de paiement après avoir appuyé sur le bouton “Procéder au paiement”.
Écran de paiement 3.8:
L’écran de paiement de l’application WooCommerce PWA contient tous les paiements en ligne disponibles sur la boutique. Les acheteurs en ligne peuvent trouver des expériences de paiement similaires sur les sites Web et les applications.
Écran 3.9 Mon compte
L’écran Mon compte de l’application mobile WooCommerce PWA permet aux acheteurs en ligne de voir leurs détails complets enregistrés sur l’application Web progressive. Cet écran affiche également une liste des commandes d’applications précédentes.
1. Données personnelles:
Les utilisateurs peuvent afficher et mettre à jour leurs informations personnelles pré-enregistrées sur l’application mobile PWA.
2. Adresse (s) d’expédition:
Les utilisateurs de l’application peuvent voir la liste complète des adresses de livraison pré-enregistrées dans l’application PWA.
3. Détails de la commande:
Les utilisateurs de l’application peuvent consulter la liste complète des commandes passées précédemment à partir de l’application PWA et leurs détails.
4. Fonction de re-commande:
Il y a un bouton de commande directe sur l’écran Mon compte de l’application PWA. Tous les produits précédents sous cette commande seront ajoutés au panier avec un seul bouton.
Écran Détails de la commande 3.91
L’écran des détails de la commande de l’application Web progressive WooCommerce fournit des détails complets sur les commandes spécifiques de l’application PWA. Les utilisateurs peuvent facilement afficher l’adresse de livraison, le résumé du produit, le mode d’expédition et de paiement, le résumé du coût total, etc. Il offre même la possibilité de suivre l’état de la commande et de la livraison.
