D’Angular à React : améliorer le module complémentaire PrestaShop PWA pour des performances plus rapides !

Dans le monde dynamique du commerce électronique, la technologie évolue continuellement, poussant les entreprises à s’adapter et à innover pour garder une longueur d’avance. Chez Knowband, nous comprenons l’importance de rester au courant des dernières tendances technologiques pour garantir que nos clients reçoivent les meilleurs outils pour réussir. C’est pourquoi nous avons fait un pas important pour notre module complémentaire PrestaShop PWA : passer d’Angular à React. Ce changement est conçu pour améliorer les performances de vos sites de commerce électronique PrestaShop, en garantissant qu’ils soient plus rapides, plus réactifs et mieux adaptés aux besoins de votre entreprise.

De plus, nous promettons une expérience utilisateur plus stable et améliorée pour vos clients dans le prochain React. PWA pour Prestashop.

Pourquoi réagir ?

La popularité et l’efficacité de React en tant que bibliothèque frontale proviennent de son DOM virtuel (Document Object Model), qui permet des performances supérieures et un rendu d’interface utilisateur plus rapide par rapport à Angular. De plus, cette transition signifie que toutes les actions que les clients effectuent sur votre site PrestaShop, qu’il s’agisse de parcourir des produits ou de finaliser des achats, seront désormais plus fluides et plus efficaces.

Performances et expérience utilisateur améliorées :

L’un des principaux avantages de l’utilisation du module complémentaire PWA de React for Knowband est l’amélioration significative des temps de chargement et de la réactivité des applications. La raison derrière cela est que React permet une interaction plus transparente sur les appareils mobiles, reproduisant la sensation d’une application native plus efficacement que jamais. Ainsi, pour toute entreprise de commerce électronique, la vitesse et la fluidité avec lesquelles les utilisateurs peuvent naviguer sur votre site peuvent affecter considérablement les ventes et la satisfaction des clients.

Processus de développement rationalisé :

Chez Knowband, nous proposons des solutions d’applications Web progressives pour les plateformes de commerce électronique Prestashop, WooCommerce, Magento 2 et Opencart. De plus, ce qui est étonnant, c’est que les fournisseurs n’ont besoin d’aucune connaissance technique pour créer leurs applications Web Android et iOS à l’aide de notre module complémentaire PWA.

De plus, l’administrateur du magasin peut créer les applications PWA en un rien de temps simplement en installant le module complémentaire PWA sur le magasin et en ajoutant des configurations Firebase.

Fonctionnalités à venir dans la prochaine version du module :

Pour l’avenir, Knowband est ravi d’introduire de nouvelles fonctionnalités dans la prochaine version de notre système basé sur React. Module complémentaire PWA PrestaShop, qui apportera encore plus de fonctionnalités à votre boutique en ligne :

Curseurs de bannière automatisés :

L’administrateur a désormais la possibilité d’ajouter des curseurs de bannière automatisés sur la page d’accueil de l’application PWA. Par conséquent, la fonctionnalité suivante vous aidera à engager vos clients avec des bannières dynamiques de haute qualité, faciles à gérer et à automatiser. Cette fonctionnalité améliore l’attrait visuel de votre site et peut être utilisée pour mettre en évidence les promotions, les nouveautés ou les articles populaires.

Vue liste/grille sur les pages de liste de produits :

Vous pouvez offrir aux utilisateurs de votre application PWA la possibilité d’afficher les produits dans un format qui correspond à leurs préférences. Le basculement entre les vues de liste et de grille sur les pages de liste de produits permettra aux clients de parcourir plus facilement les produits, de les comparer et de prendre des décisions d’achat en fonction de leurs habitudes d’achat personnelles.

Fonction de notification :

Garder vos clients informés et engagés grâce à des notifications en temps réel sur les nouveaux produits, les offres spéciales et l’état des commandes sera plus facile grâce à la fonctionnalité de notification qui sera introduite dans l’application PWA. De plus, cette fonctionnalité garantit que vos clients se sentent connectés et valorisés, ce qui peut contribuer à accroître la fidélité des clients et à fidéliser les clients.

Conclusion!

En passant d’Angular à React, Knowband Créateur d’applications mobiles PrestaShop PWA Addon est configuré pour offrir des fonctionnalités encore plus robustes et des performances améliorées. De plus, ces améliorations sont conçues pour aider votre site de commerce électronique non seulement à suivre les tendances du marché, mais aussi à les devancer, en offrant à vos clients une expérience d’achat en ligne plus rapide et plus attrayante.
Restez à l’écoute de notre prochaine version de module, qui promet d’amener votre site de commerce électronique vers de nouveaux sommets.

Chez Knowband, nous nous engageons à fournir à nos clients des solutions de pointe qui favorisent le succès et l’innovation dans le domaine du commerce électronique. Découvrez les avantages du nouveau module complémentaire PWA basé sur React et préparez-vous à faire passer votre boutique PrestaShop au niveau supérieur.

Avantages du constructeur d’applications mobiles Prestashop PWA que vous devez connaître

Nous avons toujours cherché une alternative aux publications Google Play et Apple Store. Les PWA (Progressive Web Apps) semblent être la meilleure option pour la même chose. Cette tendance devient de plus en plus populaire avec la facilité de respirer. Certes, de nombreux professionnels qualifiés et gourous de l’informatique prédisent PWA comme l’avenir. Eh bien, si vous avez une boutique Prestashop, vous pouvez facilement investir dans le Créateur d’applications mobiles Prestashop PWA par Knowband.

L’application mobile Prestashop PWA aide à reproduire la relation spécifique de type natif avec les applications du programme. Le principal avantage est que le propriétaire de la boutique n’a pas à s’occuper des publications de l’App Store ou du Play Store. Au lieu de cela, l’application Web progressive Prestashop peut être fournie en ouvrant simplement l’URL du site Web sur une application mobile. Lorsque les clients ouvrent l’URL du magasin sur mobile, ils ont la possibilité d’ajouter la PWA de commerce électronique à leur écran d’accueil.

Si vous possédez une boutique Prestashop, cet article vous expliquera les avantages d’avoir un Application mobile Prestashop PWA. Êtes-vous prêt à en savoir plus sur eux ? Vous pouvez aller de l’avant et les vérifier vous-même pour une meilleure compréhension.

Lecture recommandée: ,warPrincipaux exemples d’applications Web progressives robustes (PWA) développées par KnowBand

Les avantages essentiels du constructeur d’applications mobiles Prestashop Pwa

  • Augmentation du taux de conversion et des gains

Le créateur d’applications mobiles Prestashop PWA peut aider les entreprises de commerce électronique à améliorer les conversions mobiles. De plus, fournir un cycle réduit pour fournir l’application directement à partir du site Web mobile dirige les consommateurs vers l’application Web progressive. Les applications, avec leur navigation en couches et leur paiement sur une seule page, ont le potentiel d’être un point central de rémunération pour les organisations de commerce électronique.

  • Moins d’efforts et de dépenses de développement

Avec les applications d’achat natives, les détaillants de commerce électronique doivent engager des dépenses et des efforts importants pour créer et distribuer des applications Android et iOS. Le cycle de publication sur Google Play et l’App Store d’Apple est fascinant. Cependant, cela devient parfois un problème pour les propriétaires d’entreprise qui ne comprennent pas les subtilités. Dans la situation actuelle, Prestashop PWA Mobile App Creator vient à la rescousse. L’application mobile Prestashop PWA est facilement résolue en accédant à l’URL de la boutique sur une application mobile et en ajoutant le logo à l’écran d’accueil du téléphone portable. Votre formulaire mobile sera converti en une application PWA pendant que la transition de bureau reste active.

Lecture recommandée: L’avenir des PWA pour le commerce électronique et la place de marché en ligne

  • Cibler un public mobile plus large

Le Prestashop PWA Mobile App Builder est une excellente alternative pour les entreprises de commerce électronique car il fonctionne parfaitement avec Android et iOS. Vous pouvez utiliser l’application Prestashop�eCommerce PWA pour cibler le monde entier ou certaines régions. Plus il y aura d’utilisateurs qui visiteront le site Web, plus il y aura de fondations d’applications Web progressives. De plus, les applications seront placées dans l’armoire d’applications avec d’autres applications. La fonctionnalité sera entièrement native et les utilisateurs n’auront qu’à lancer l’application pour rechercher des articles et d’autres données de magasin.

  • La décision commerciale approuvée

Si vous pensez qu’un modèle vous aidera à comprendre la PWA du commerce électronique, vous devriez envisager Twitter, Alibaba et bien d’autres. Voici quelques-unes des différentes entreprises qui utilisent la tendance des applications Web progressives pour améliorer les conversions et les paiements. Les applications mobiles PWA peuvent être utilisées par les petites et les grandes entreprises de commerce électronique Prestashop pour augmenter immédiatement les ventes des clients mobiles.

  • Fonctionne rapidement dans n’importe quelle situation, même hors ligne

Les PWA de commerce électronique sont exceptionnellement légères et se bloquent ou s’arrêtent rarement sur les appareils mobiles. Le développement de l’application Prestashop eCommerce PWA est sophistiqué, garantissant que les éléments se chargent et s’exécutent plus rapidement par rapport aux applications natives. Un chargement plus rapide et un fonctionnement transparent peuvent améliorer l’expérience d’achat des consommateurs mobiles à tout moment. Une autre caractéristique importante est que PWA pour Prestashop peut fonctionner en mode hors ligne – avec une connexion Web faible ou inexistante.

Lecture recommandée :�Comment les Progressive Web Apps (PWA) peuvent améliorer les conversions mobiles d’une boutique eCommerce ?

  • Surveillance simplifiée du panneau d’administration dans l’application mobile Prestashop Pwa

L’application Web progressive de commerce électronique crée un panneau d’administration simple (backend) pour gérer et personnaliser l’application Web progressive en direct. Il n’y a aucune raison impérieuse de contacter le support client ou de comprendre comment coder. L’administrateur de la boutique n’a qu’à apporter les modifications nécessaires. De plus, la PWA de commerce électronique en direct sera automatiquement mise à jour. L’option de conception de la page d’accueil permet à l’administrateur du magasin de modifier l’apparence et la convivialité du live Groupe de connaissances Progressive Web App pour Prestashop à tout moment sans changer le code.

  • Les notifications push sont un excellent moyen de faire de la publicité

Pendant longtemps, les notifications push ont été une partie importante du marketing pour tout site de commerce électronique. Nous aurions tous reçu des alertes push sur nos téléphones portables pour les applications d’achat natives installées. C’est également possible dans vos applications PWA grâce à la Progressive Web App pour Prestashop. Le propriétaire du magasin pourra planifier et diffuser des alertes push sur mesure et prédéfinies sur les appareils mobiles.

  • Montant pas à pas sur la page du produit

Le montant pas à pas est une autre extension qui permet aux clients du Créateur d’applications mobiles Prestashop PWA augmenter ou diminuer le nombre de produits individuels avant de les soumettre à leur conteneur. Le bouton +/- sur l’écran de l’article de l’addon Prestashop est tout ce dont les acheteurs ont besoin.

  • Le bouton Ajouter au panier de la page d’accueil et de la page de catégorie facilite le travail

Les clients peuvent facilement ajouter des produits au panier à partir des pages d’accueil et de catégorie. En utilisant le module, les clients n’ont pas besoin de reconsidérer l’ajout des produits car l’écran d’accueil et les pages de classe ont actuellement le bouton Ajouter au panier accessible.

  • Produits connexes Aides à l’accessibilité dans la vente croisée

Avec la similitude avec l’addon Prestashop Automatic Related Products, l’application Web progressive Prestashop permet à l’administrateur de vendre des choses. En outre, il peut afficher des produits connexes sur le site pour que les clients puissent choisir et acheter davantage. Par la suite, plus de ventes et de revenus attendus.

Lecture recommandée: ,warLa Progressive Web App Prestashop est la nouvelle mode � En savoir plus !

Finissons-en !!

Si vous voulez garder une longueur d’avance sur le marché du commerce électronique, utilisez Prestashop PWA Mobile App Builder pour vous aider à y arriver. Compte tenu du grand nombre de PWA, c’est le moment idéal pour convertir votre boutique Prestashop en application mobile. Offrez une expérience d’achat déconcertante avec des fonctionnalités améliorées telles que la vitesse rapide, le fonctionnement hors ligne, les alertes push, le référencement et bien plus encore.

Donner aux utilisateurs l’accès à une application PrestaShop PWA optimisée améliorerait leur expérience d’achat mobile. Avec l’aide de ce module PrestaShop PWA App, vous pouvez transformer votre boutique en ligne en une application Web conviviale qui peut être maintenue à partir du backend. Ces applications offrent un certain nombre de fonctionnalités supplémentaires que l’on ne trouve pas dans les applications natives, notamment le mode hors ligne et l’indépendance de la plate-forme, ce qui en fait une option d’achat simple et transparente pour les clients. Vous pouvez même contacter l’équipe d’assistance pour toutes vos questions à support@knowband.com.

Créez une application PWA légère pour votre boutique PrestaShop | Avantages et procédures?

Les applications légères sont un besoin pour presque toutes les industries, en particulier le commerce électronique; qu'il s'agisse d'une organisation établie ou d'une startup. Quelle que soit la démographie des consommateurs / publics qu'ils ciblent, les applications légères sont en plein essor. Cet article se concentre principalement sur la création d'une application mobile PrestaShop PWA tout en vous présentant les avantages supplémentaires des applications Web progressives. Vous devez être conscient de la nature de base d'une application légère qui consomme moins d'espace sur les appareils des utilisateurs de l'application sans compromettre la qualité et la fonctionnalité de l'application. En outre, les applications légères chargent le contenu plus rapidement et exécutent généralement toutes les tâches plus rapidement, par rapport aux applications natives. Ces deux facteurs aident les applications légères à prospérer même dans les zones qui ne disposent pas d'une connexion Internet à très haut débit. Les applications Web progressives ou PWA sont une excellente solution à cela. Les PWA sont non seulement plus rapides et moins gourmandes en espace, mais offrent également un plus large éventail d'avantages aux propriétaires de magasins et aux utilisateurs d'applications. Avoir une PWA PrestaShop (application web) peut faire des merveilles pour une entreprise. Et en créer un pour votre entreprise est maintenant aussi simple qu'un gâteau en utilisant une extension prête à l'emploi, c'est-à-dire un module PrestaShop PWA Builder. Avant de vous plonger dans cela, vous devez parcourir les avantages qui viennent avec une PWA (application web) pour votre boutique PrestaShop.

Construire une application légère à l'aide du PrestaShop PWA Builder:

Étape 1 : Je m’abonne! PrestaShop PWA Mobile App Builder du KnowBand. Installez ce module sur votre site PrestaShop.

Étape 2 : Remplissez le formulaire de pré-requis de l'application fourni par KnowBand.

Étape 3 : Passez en revue votre application Web PrestaShop développée et confirmez pour la faire vivre. Cette application mobile PWA pour PrestaShop crée facilement une application Web progressive dérivée de votre propre site Web de commerce électronique PrestaShop.

Caractéristiques de l'application mobile PrestaShop PWA:

En raison de ses riches fonctionnalités et de ses possibilités de personnalisation, les applications progressives gagnent chaque année en popularité auprès des entreprises. Les PWA et ses versions hybrides ont en fait été étiquetés comme l'avenir des applications et les entreprises de commerce électronique peuvent en tirer le meilleur parti.

Autres avantages d'une application PrestaShop PWA:

  • Les applications Web progressives (PWA) sont moins gourmandes en espace et plus rapides que les applications mobiles traditionnelles (applications natives). Les PWA sont plus rapides, même pour les sites de commerce électronique comme sur PrestaShop, car le contenu de la page se télécharge progressivement à mesure que l'utilisateur continue de naviguer. Notez également que les PWA sont des applications Web codées en HTML, CSS et javascript, d'où le nom «Progressive Web App».
  • Une seule application PrestaShop PWA peut fonctionner sur tous les systèmes d'exploitation, c'est-à-dire sur Android, iOS, Windows, etc. En effet, les PWA fonctionnent sur les navigateurs Internet. La même chose n'est pas possible avec les applications natives car vous auriez besoin de créer 2 applications natives – une pour Android et une autre pour iOS, toutes deux dans différents langages de programmation.
  • Les PWA apparaissent exactement comme une application mobile native une fois que les visiteurs naviguant sur votre site PrestaShop ont ajouté la PWA à leur écran d'accueil.
  • Les PWA étant des applications Web, vous n'avez pas besoin de publier votre PWA PrestaShop sur le Play Store ou l'App Store pour le rendre disponible à votre public. Par conséquent, il n'y a aucune dépendance à l'égard des magasins d'applications mobiles avec PWA.
  • Les applications Web progressives peuvent être facilement partagées par les utilisateurs de votre site / application à l'aide d'une simple URL. Les nouveaux utilisateurs n'ont pas besoin de télécharger et d'installer votre application avant de l'utiliser. Ils peuvent accéder directement à votre application Web PrestaShop à partir de leur navigateur, puis choisir de l'ajouter directement à leur écran d'accueil. Et c'est à ce moment-là qu'elle commencerait à agir comme une application native avec l'icône de l'application sur l'écran d'accueil de leurs appareils et dans leur menu.
  • Les applications Web progressives peuvent également utiliser la plupart des fonctionnalités de l'appareil (smartphones / tablettes) comme les caméras, les microphones, etc. Bien que l'utilisation du géofencing et du NFC dans les PWA soit encore à venir dans un avenir proche.
  • Les PWA vous permettent également d'envoyer des notifications push aux utilisateurs de votre application, comme le ferait une application native.
  • Les PWA utilisent des URL sécurisées (https: //), vous n'avez donc pas à vous soucier des problèmes de sécurité.
  • Les applications Web progressives sont plus faciles à mettre à jour et à maintenir. Les utilisateurs de votre application Web PrestaShop n'auront pas besoin de mettre à jour manuellement leurs PWA. C'est une tâche impliquée avec les applications natives, pas avec les PWA.

Conclusion:

Comme la possession d'une application PWA pour votre boutique PrestaShop est devenue plus facile et abordable, c'est le moment idéal pour opter pour ces applications Web. L'utilisation du module PrestaShop PWA Builder est un moyen intelligent de créer votre application Web. Chez KnowBand, nous proposons également des applications natives (Android et iOS) pour PrestaShop. Découvrez-les ci-dessous:

PrestaShop Mobile App Builder

PrestaShop Advanced Marketplace avec application mobile

Si vous avez des questions concernant ce module de création d'application, n'hésitez pas à nous envoyer un courriel à support@knowband.com. Nous serions ravis d'entendre vos précieux commentaires !!


Application Web progressive PrestaShop (PWA) – Manuel de l’utilisateur

1.0 Présentation

La croissance rapide de l’industrie du mCommerce a conduit à l’urgence de disposer d’une application mobile de commerce électronique. Mais la création d’applications mobiles implique beaucoup de codage et d’autres aspects techniques. Pourquoi ne pas transformer votre site Web en ligne en une application Web? Offrir une application PrestaShop PWA optimisée améliorerait l’expérience d’achat mobile pour les utilisateurs. Ce module d’application PrestaShop PWA est conçu et construit pour transformer votre boutique en une application Web qui peut être gérée à partir d’un panneau backend convivial. Ces applications proposent diverses fonctionnalités étendues que les applications natives telles que le mode hors ligne et l’indépendance de la plate-forme, ce qui en fait une solution d’achat sans tracas et transparente pour les utilisateurs.

1.1 Voir l’application de démonstration:

Avant d’acheter l’extension, affichez le fonctionnement de l’application de démonstration en ouvrant l’URL de l’application de démonstration PrestaShop PWA sur votre navigateur.

URL du magasin de démonstration: https://psm.knowband.com/pwa/admin1
URL de l’application PWA: ,warhttps://psm.knowband.com/pwa/pwa-app/

1.2 Principales caractéristiques de l’application Web progressive PrestaShop (PWA):

  • Interface d’écran d’accueil personnalisable (éditeur de bricolage)
  • Notifications push illimitées (notifications manuelles et automatisées)
  • Prise en charge du chat Zopim et WhatsApp
  • Prise en charge de tous les modes de paiement et d’expédition
  • Synchronisation en temps réel
  • Mise à jour automatique de l’inventaire
  • Application légère avec chargement plus rapide
  • Prise en charge multilingue et RTL
  • Options de connexion aux e-mails et aux réseaux sociaux (Google et Facebook)
  • Interface intuitive avec navigation en couches
  • Aucune dépendance sur Google Play ou Apple App Store
  • Solution complète en marque blanche
  • Accessibilité en mode hors ligne
  • Paiement d’une page simplifié
  • Contrôle des pages CMS (pages d’informations)
  • Présenter les produits connexes
  • Afficher les avis des utilisateurs
  • Fonctionnalité de liste de souhaits intégrée
  • Assistance pour les coupons / bons
  • Prise en charge de plusieurs devises

[IMP] Remarques pour iOS :

–> 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 peuvent être envoyées qu’à l’appareil Android à partir du panneau d’administration de PrestaShop PWA Mobile App Builder.

[NOUVELLE MISE À JOUR] PrestaShop PWA prend en charge les scripts de langage RTL

Le créateur d’applications mobiles PrestaShop PWA 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 apporter toutes les langues de son magasin sur l’application Web progressive et peut même ajouter toutes les langues RTL. selon l’exigence. D’autre part, les acheteurs mobiles ne rencontreront aucun problème pour accéder à l’application mobile PrestaShop PWA dans leur langue préférée.

Compatible avec le marché multifournisseur PrestaShop

La Marché multifournisseur PrestaShop Le module est entièrement compatible avec l’application mobile PrestaShop PWA. L’application Web progressive affiche la section des vendeurs avec tous les vendeurs de la place de marché sur la même application. Les détails du vendeur restent synchronisés en temps réel avec le Web de la place de marché et seront mis à jour automatiquement sur l’application PrestaShop PWA.

Remarque: L’application mobile PWA multifournisseur pour PrestaShop est uniquement centrée sur le client. Cela signifie qu’il n’y aura pas de tableau de bord ou de gestion du vendeur à partir de l’application. L’administrateur du magasin peut gérer les vendeurs à partir du module PrestaShop Marketplace et le même sera mis à jour instantanément sur l’application.

Écrans du panneau d’administration 2.0

L’application mobile PrestaShop PWA peut être entièrement configurée à l’aide de ces onglets et paramètres d’administration pratiques. Tout ce que vous avez à faire est de faire les clics et les boutons nécessaires pour effectuer les modifications dans Progressive Web App. Discutons chacun d’eux en détail:

Paramètres généraux 2.1

Comme leur nom l’indique, ces paramètres de configuration généraux sont destinés à toutes sortes de modifications régulières dans les applications Web progressives (PWA). Les options sous cet onglet permettent à l’application de fonctionner sur les appareils des acheteurs en ligne.

a) Activer le plugin:Activez le module PrestaShop PWA pour que l’application fonctionne sur les appareils mobiles.
b) Redirection sur la page du panier lors de l’ajout au panier: Cette fonctionnalité permet à l’administrateur de contrôler la redirection du bouton «Ajouter au panier». Les utilisateurs peuvent être redirigés vers le panier ou conservés sur l’écran du produit en appuyant sur “Ajouter au panier”.
c) Description abrégée de l’affichage:�Activer l’affichage d’une courte description du produit sur l’écran du produit de Progressive Web App (PWA).
d) Activer le logo: Ajoutez le logo de votre boutique sur l’en-tête de Progressive Web App (PWA) et présentez votre marque aux utilisateurs.

e) Couleur d’arrière-plan de l’écran de démarrage: Choisissez la bonne option de couleur pour l’arrière-plan de l’écran de démarrage de l’application Web progressive (PWA).
f) Nom de l’application PWA: Choisissez le nom de votre application PWA selon votre choix.
g) Sélectionnez Disposition:Choisissez la mise en page d’accueil souhaitée pour votre application PrestaShop. Vous pouvez créer plusieurs mises en page d’écran d’accueil dans le backend selon divers festivals et thèmes et les utiliser selon les exigences de votre magasin.
h) Méthodes d’expédition désactivées:Désactiver les méthodes d’expédition de travailler dans Progressive Web App (PWA) selon ce que vous ne vous sentez pas bien. Sur le site Web, ils fonctionneront généralement bien.
i) Pages CMS activées:Choisissez les pages CMS souhaitées à afficher sur l’application PrestaShop PWA.
j) Activer le rapport du journal des demandes:Activez l’option pour partager le fichier journal sur les applications Web progressives afin d’obtenir des détails sur tout type de comportement anormal de l’application.
k) Activez le codage URL des liens d’image:�Activez cette fonctionnalité pour prendre en charge les caractères non ASCII sur l’application Web progressive (PWA).

Paramètres de notifications push 2.2

Les notifications push sont un outil pratique pour commercialiser et promouvoir les produits, les offres et les offres de vente de votre magasin. Les paramètres sous cet onglet permettent aux utilisateurs de configurer et d’envoyer des notifications push illimitées sur l’application PrestaShop PWA.

Les différents détails sous ces paramètres seront obtenus lorsque vous définissez le compte Firebase. Voici le processus étape par étape pour le faire:

2.21 Comment configurer 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 : Accédez aux options d’authentification:

Étape 5 : Rechercher des 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 liés à 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 les paramètres:

Étape 9 : Ajoutez votre domaine dans authentification >> connexion.

A) Notification push de commande réussie:

Activer / désactiver la notification push automatisée envoyée aux utilisateurs de l’application pour une création de commande réussie à partir de l’application PrestaShop PWA.

B) Notification push de mise à jour de l’état de la commande:

Activer / Désactiver la notification push automatique envoyée aux utilisateurs de l’application pour toute mise à jour concernant l’état de livraison de leur commande précédente. Les utilisateurs peuvent voir ce statut sous l’onglet “Détails de la commande” de l’application PWA

C) Notification push de panier abandonné:

Activer / désactiver la notification push automatisée envoyée aux utilisateurs qui ont abandonné le panier sans achat réussi. Cette notification push sera envoyée aux utilisateurs automatiquement après l’intervalle de temps entré.

2.2 Historique des notifications push

Ici, l’administrateur du magasin peut afficher l’historique complet des notifications push envoyées à Progressive Web App (PWA). Parallèlement à cela, l’administrateur du magasin peut même personnaliser la notification manuelle et l’envoyer aux utilisateurs de Progressive Web App.

A) Envoyer une notification:

Quoi de mieux pour concevoir et envoyer des notifications push selon les besoins ? Cette option permet aux propriétaires de boutiques de configurer et d’envoyer manuellement une notification personnalisée aux utilisateurs de l’application PrestaShop PWA.


Mise en page de la page d’accueil 2.3

Le module PrestaShop PWA permet à l’administrateur du magasin de contourner les restrictions liées à l’interface utilisateur fixe de l’écran d’accueil et de concevoir celle qui convient à ses besoins professionnels. Cet onglet permet à l’administrateur du magasin de créer et d’enregistrer plusieurs mises en page et de les utiliser selon les occasions et les festivals en cours.


Afin de configurer les mises en page de page d’accueil de l’application PWA, les éléments suivants sont disponibles dans le back-end:

A) Top Catégories:

Les principales catégories sont affichées sous la forme de petits carrés sur l’écran d’accueil de Progressive Web App (PWA). Leurs images et leurs liens de redirection peuvent être configurés à partir d’ici. Ces catégories peuvent être utilisées pour mettre en évidence les meilleures marques sur l’écran d’accueil de l’application. Le module PrestaShop PWA permet un maximum de 8 catégories dont 4 minimum sont obligatoires.

B) Bannière carrée:

La liste des bannières carrées sur l’écran d’accueil de l’application Web progressive (PWA) propose un bloc de bannière de forme carrée dans lequel l’administrateur du magasin peut utiliser l’image souhaitée. Le lien de redirection correspondant peut être utilisé pour ces bannières.


C) Bannière coulissante horizontale:

Voici le bloc de bannière en forme de rectangle disponible en glissement horizontal sur l’écran d’accueil de l’application PrestaShop PWA. Pour cela également, le lien image et redirection est entièrement configurable.

D) Grille Bannières:

Ce sont des bannières de forme carrée répertoriées sur l’écran d’accueil de Progressive Web App (PWA) sous la forme d’une vue en grille. L’administrateur du magasin peut ajouter autant de bannières que nécessaire et définir leur lien de redirection.


E) Bannière du compte à rebours:

Le module PrestaShop PWA permet à l’administrateur du magasin de configurer et d’ajouter une bannière basée sur une minuterie sur l’écran d’accueil de l’application Web. L’administrateur du magasin peut ajouter une image de bannière et un écran d’atterrissage avec une minuterie jusqu’à ce que la bannière soit affichée sur l’écran d’accueil de l’application Web progressive. Une fois la minuterie terminée, la bannière sera supprimée automatiquement.


F) Produits carrés:

À partir des bannières, les applications mobiles PrestaShop PWA permettent de présenter les produits dans une liste de blocs carrés. L’administrateur peut choisir les produits pour cet élément.


G) Produits coulissants horizontaux:

Vous pouvez ajouter les produits sous forme de glissement horizontal. Les produits choisis peuvent être du choix de l’administrateur du magasin, tels que les nouveautés, les meilleures ventes, les produits personnalisés, etc.


H) Produits de grille:

Les produits peuvent également être ajoutés sur l’écran d’accueil sous la forme de listes de blocs d’affichage en grille. L’administrateur du magasin peut choisir les produits souhaités et la quantité à afficher sur l’écran d’accueil de l’application PrestaShop PWA.


I) Produits récemment consultés:

Le module PrestaShop Mobile PWA permet au propriétaire du magasin d’ajouter un élément d’onglet récent sur l’écran d’accueil de l’application Web. Il affichera tous les produits consultés récemment par les utilisateurs.

Remarque: L’administrateur du magasin peut ajouter jusqu’à 20 éléments lors de la conception de la mise en page dans le panneau principal.

2.4 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.

2.5 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.

3.0 Écrans de l’application PWA frontale:

Écran d’accueil 3.1

1. Disposition dynamique:

En utilisant divers éléments de conception, l’administrateur du magasin peut créer une mise en page dynamique selon les besoins.

2. Logo du magasin:

Ajoutez le logo du magasin sur l’en-tête de la Progressive Web App (PWA).

3. Panier:

L’icône du panier dans le coin supérieur droit de l’écran d’accueil permet aux utilisateurs d’activer l’écran du panier.

4. Menu de navigation:
Parcourez les catégories dans les applications avec le menu de navigation de gauche sur l’écran d’accueil.

Menu 3.2 Accordion (barre de navigation)

L’application Web progressive propose une catégorisation appropriée des produits disponibles sur le site Web. Les acheteurs mobiles peuvent facilement parcourir les produits de plusieurs catégories. Toutes les pages CMS sont également disponibles dans le menu Accordéon. Il propose les options suivantes:

1. Mon compte:
L’option Mon compte contient toutes les informations personnelles, d’expédition et de commande de l’utilisateur. Les acheteurs d’applications PWA peuvent voir toutes les données stockées qui leur sont associées et peuvent également les mettre à jour.

2. Les catégories
Les catégories affichées dans le menu de navigation de gauche de l’application Web progressive (PWA) sont les mêmes que celles de votre site Web.

3. Pages CMS:
Diverses pages CMS telles que À propos de nous, Contactez-nous, Termes et conditions, etc. Accessible à partir d’ici.

4. Langue (s)
L’option de langue permet aux utilisateurs de l’application PWA de visualiser l’application Web dans la langue de leur choix. Toutes les langues disponibles sont affichées sous cette option uniquement.

5. Monnaie (s)
Toutes les devises disponibles sur votre site Web sont affichées ici sur l’application PrestaShop PWA.

6. Connexion / Déconnexion
Les utilisateurs peuvent facilement se connecter / se déconnecter de l’application Web progressive PrestaShop via cette option.

Écran de catégorie 3.3:

1. Vues multiples:
Les catégories sur Progressive Web App (PWA) pour PrestaShop peuvent être visualisées à la fois en mode liste et en mode grille.

2. Tri:
Cette option permet aux acheteurs en ligne de choisir l’ordre de tri afin d’affiner la recherche et d’obtenir facilement le produit souhaité.

3. Filtre:
L’option de filtrage des produits simplifie la recherche de produits. Les utilisateurs peuvent filtrer tous les produits sous des catégories en utilisant divers attributs comme la taille, la couleur, le prix, etc.

Écran de produit 3.4:

L’écran du produit de votre Progressive Web App (PWA) est simple et intrigant. Plusieurs images du même produit sont affichées avec le nom et le prix. La disponibilité du produit est également affichée sous la forme “En stock” ou “En rupture de stock” en fonction de statut de l’inventaire. Il contient les autres options suivantes:

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 décider rapidement à propos de 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 un produit 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 le produit sur plusieurs canaux sociaux.

Écran de connexion 3.5

La Progressive Web App (PWA)�offre diverses options de connexion en un clic et rend le processus de connexion / d’inscription plus transparent:

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. S’inscrire
Tous les nouveaux utilisateurs de l’application peuvent s’inscrire et créer leur compte sur la boutique à partir de l’application PrestaShop PWA. Le formulaire d’inscription ne demande que les détails nécessaires pour créer un compte.

3. Se connecter avec Facebook
Les utilisateurs peuvent se connecter à l’application PWA en utilisant leurs identifiants de compte Facebook.

4. Connexion avec Google+
Les utilisateurs peuvent se connecter à l’application Web progressive (PWA) à l’aide de leurs informations d’identification de compte Google.

Écran du panier d’achat 3.6:

L’écran Panier de votre application Web Progressive affichera tous les produits ajoutés au panier. Les utilisateurs de l’application peuvent afficher le nom du produit, quantité, prix total et 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 saisir des 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. Continuer vos achats
Les utilisateurs peuvent quitter le panier pour parcourir plus de produits sur votre application Web progressive.

6. Continuer à 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

Les applications Web progressives avec le module PrestaShop Progressive Web App (PWA) ont une interface simplifiée paiement en un seul écran avec uniquement les informations pertinentes. Les utilisateurs peuvent afficher les détails complets de la commande, tels que les détails d’expédition, les détails de facturation, le résumé de la commande, le commentaire de la commande, le résumé 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 Web progressive peuvent consulter les détails du produit avant d’effectuer le paiement.

3. méthodes de livraison
Toutes les méthodes d’expédition disponibles sont affichées ici. Les utilisateurs peuvent choisir celui qui convient à leurs besoins.

4. Commentaire de 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.

6. Résumé des paiements
Cette section affiche les détails de paiement détaillés impliqués avec l’achat.

7. Procéder au paiement
Les utilisateurs de l’application Web progressive (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 PrestaShop�PWA contient tous les paiements en ligne disponibles sur la boutique. Les acheteurs en ligne peuvent trouver une expérience de paiement similaire sur le site Web et les applications Web progressives.

Écran 3.9 Mon compte

L’écran Mon compte de l’application Web progressive PrestaShop (PWA) permet aux utilisateurs de visualiser leurs détails complets enregistrés sur l’application, y compris une liste des commandes précédentes.

Écran Détails de la commande 3.10

L’écran des détails de la commande de l’application Web progressive PrestaShop fournit les détails complets de la commande spécifique 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 existe même une option pour suivre l’état de la commande et sa livraison.