Application mobile WooCommerce pour les clients : options et plan de test

Une application mobile WooCommerce pour les clients est une application iOS et Android distincte sous le nom de votre magasin que les acheteurs installent pour parcourir et acheter. Vous pouvez en obtenir de quatre manières : un plugin d'application qui redessine votre catalogue à partir de l'API WooCommerce, un convertisseur de site Web en application qui charge votre boutique en direct, un service géré ou une version personnalisée. Le bon choix dépend principalement de la part de votre boutique dans les plugins.

Ce guide vous aide à choisir un itinéraire, puis à prouver qu'il fonctionne dans votre propre magasin avant de dépenser de l'argent. Pour la version courte, voir le WooCommerce vers la page de l'application. Pour une comparaison plus large couvrant également les sites de contenu WordPress, lisez WordPress vers plugins d'application vs convertisseurs.

L'application officielle WooCommerce est-elle destinée aux clients ?

Non. L'application WooCommerce disponible sur l'App Store et Google Play est une application de gestion de magasin destinée aux commerçants. WooCommerce's documentation de l'application mobile le décrit en ces termes : vous traitez les commandes, créez et gérez des produits et acceptez les paiements en personne. Vos clients ne peuvent pas y faire leurs achats et il ne porte pas votre marque.

Une application client est une autre chose. Il porte le nom et l'icône de votre magasin, se trouve sur l'écran d'accueil d'un acheteur et ouvre votre catalogue, votre panier et votre espace compte. WooCommerce n'en expédie pas, donc chaque magasin l'obtient auprès d'un tiers ou le construit.

Un magasin WooCommerce devrait-il avoir une application ?

Une application gagne sa place lorsque les mêmes personnes achètent chez vous encore et encore. Avant de comparer les itinéraires, vérifiez votre magasin par rapport à ces questions.

• Les clients commandent-ils à nouveau ? Le café, la nourriture pour animaux, les suppléments, les soins de la peau, les fournitures d'impression et les pièces commerciales sont achetés selon un cycle. Une icône sur l'écran d'accueil et une connexion enregistrée raccourcissent chaque commande répétée.
• Les clients se connectent-ils pour faire quelque chose ? Les abonnements à suspendre ou à ignorer, les réservations à gérer, les listes de prix de gros, le suivi des commandes et les téléchargements donnent tous une raison aux gens d'ouvrir régulièrement un espace de compte.
• Avez-vous des nouvelles qui méritent d'être notifiées ? Les baisses, les réapprovisionnements, les gammes saisonnières et les ventes correspondent aux poussées. Un magasin qui change deux fois par an n’a pas grand chose à envoyer.
• Le site mobile est-il déjà bon ? Si les acheteurs par téléphone abandonnent votre paiement aujourd'hui, une application construite sur ce paiement hérite du problème.

Si la plupart de vos commandes proviennent de nouveaux visiteurs arrivant via la recherche ou les annonces, concentrez plutôt vos efforts sur le site mobile. Personne n’installe une seule fois une application pour acheter.

Qu'est-ce qui différencie WooCommerce d'une boutique hébergée ?

WooCommerce vous donne WordPress et vous permet d'assembler le reste. Un magasin typique gère un thème, une passerelle de paiement ou trois, un calculateur d'expédition, puis les plugins qui en font le vôtre : abonnements WooCommerce, réservations, modules complémentaires de produits, un plugin de tarification de gros, un programme de fidélité, un champ de paiement personnalisé pour les bons de livraison.

Posez donc une question pour chaque itinéraire ci-dessous : l'application affiche-t-elle ce que mes plugins ajoutent, ou seulement ce que WooCommerce connaît de base ?

Quelles sont les quatre façons d'obtenir une application client WooCommerce ?

Route 1 : un plugin d'application qui reconstruit la boutique à partir de l'API

Plusieurs services se connectent à votre boutique via le API REST WooCommerce, généralement avec un plugin compagnon WordPress, et dessine les produits, les catégories, le panier et les commandes comme leurs propres écrans natifs. Vous concevez l'application dans le tableau de bord du fournisseur et payez un abonnement.

Bon à : des listes de produits natives et des pages de produits qui défilent et s'animent comme n'importe quelle application d'achat, et un écran d'accueil que vous pouvez présenter différemment de votre site Web.

Vérifiez attentivement : l'API décrit les produits, les variantes, les clients et les commandes. Il ne décrit pas ce qu'un plugin tiers affiche sur la page. Un formulaire de modules complémentaires, un calendrier de réservation, des prix basés sur les rôles ou une étape de paiement personnalisée nécessitent chacun que le fournisseur ait pris en charge ce plugin spécifique. Certains de ces services affichent le paiement de votre site Web dans une WebView pour cette raison. Demandez au fournisseur une liste des extensions et passerelles prises en charge, puis comparez-la avec votre propre liste de plugins ligne par ligne.

Voie 2 : Un convertisseur de site Web en application

Un convertisseur construit un shell natif autour de votre site Web en direct. Le shell fournit l'icône de l'application, l'écran de lancement, un en-tête natif, des menus et des onglets inférieurs, ainsi que des notifications push facultatives. Votre vitrine se charge à l'intérieur dans une WebView, le même moteur de navigateur que Safari et Chrome utilisent.

Bon à : fidélité. Quel que soit votre thème et vos plugins affichés sur un téléphone, c'est ce que l'application affiche, car il s'agit de la même page du même serveur. Rien n'a besoin d'être synchronisé et vous ne gérez pas un deuxième catalogue ou une deuxième conception.

Vérifiez attentivement : vous n'obtenez pas d'écrans de produits redessinés de manière native. L'application est aussi rapide et soignée que votre site mobile et pas mieux. Certaines choses se comportent différemment dans un navigateur intégré que dans Safari ou Chrome, ce à quoi sert le plan de test ci-dessous.

SiteTo.App prend cette route. Vous collez l'URL de votre boutique, définissez le nom, l'icône et les onglets, et prévisualisez gratuitement l'application sur votre propre téléphone. Une version coûte 29 $ pour Android, 79 $ pour iOS ou 99 $ pour les deux, payés une fois.

Voie 3 : un service d'application géré

Un service géré utilise généralement la même approche WebView pour vos pages et ajoute une équipe : ils configurent l'application, créent des écrans natifs personnalisés là où vous le souhaitez, les soumettent aux magasins et la maintiennent moyennant des frais mensuels. Notre Comparaison SiteTo.App vs MobiLoud examine un de ces services en détail.

Route 4 : Une application personnalisée

Un développeur ou une agence crée une application à l'aide de l'API REST et de l'API Store, chaque écran étant conçu pour votre boutique. C'est la voie à suivre pour les choses qu'un site Web ne peut pas faire, comme travailler entièrement hors ligne. Son prix est celui d'un projet et nécessite ensuite une maintenance, y compris une refonte lorsque vous modifiez un plugin dont dépend l'application.

Comment les itinéraires se comparent-ils ?

L'adhésion développeur d'Apple (99 $ par an) et l'inscription à Google Play (25 $ une fois) s'appliquent à chaque itinéraire. Le guide des coûts des applications de sites Web couvre la totalité du budget.

Quel itinéraire correspond à quel magasin WooCommerce ?

Choisissez un plugin d'application basé sur une API si votre magasin est proche du stock WooCommerce, avec des produits simples et variables et une passerelle grand public, et une sensation de navigation native compte plus pour vous qu'un faible coût fixe.

Choisissez un convertisseur si votre boutique mobile fonctionne déjà bien et qu'une partie significative de celle-ci provient de plugins. Cela inclut les boîtes d'abonnement, les réservations, les configurateurs de produits, les magasins de gros avec des prix connectés et les magasins avec une caisse personnalisée.

Choisissez un service géré si vous souhaitez qu'une équipe soit responsable du lancement et de la maintenance, ou si vous avez besoin d'écrans natifs personnalisés au-dessus de votre site et que les frais mensuels sont logiques par rapport aux revenus de votre application.

Choisissez une version personnalisée si l'application doit faire quelque chose qu'un navigateur ne peut pas faire : fonctionner correctement hors ligne, communiquer avec le matériel Bluetooth, utiliser la réalité augmentée ou continuer à travailler en arrière-plan.

Quand SiteTo.App est-il le mauvais choix ?

• Votre site mobile est le problème. Un thème lent ou un paiement gênant sur un téléphone sera tout aussi lent et gênant dans l'application. Corrigez d'abord le site.
• Vous avez besoin d’une poussée du cycle de vie. SiteTo.App envoie un titre, un texte, une image et un lien à tous ceux qui se sont inscrits, via votre propre projet Firebase. Il n'envoie pas de notifications automatiques de panier abandonné ou de statut de commande, et il n'a pas encore de segments ni de planification.
• Vous vendez du contenu numérique sur iOS. L'application utilise le paiement sur votre site Web et n'ajoute pas l'achat intégré à l'application d'Apple. Voir les notes de publication ci-dessous.

Il n’est pas non plus adapté au Bluetooth, à la RA, à une utilisation intensive hors ligne ou au traitement en arrière-plan.

Comment tester une boutique WooCommerce en tant qu'application ?

Utilisez un vrai iPhone et un vrai téléphone Android si vous envisagez d’expédier les deux, et suivez ces étapes dans l’ordre. Notez l'URL de la page chaque fois que quelque chose échoue.

Étape 1 : Préparez le magasin

Mettez chaque passerelle de paiement en mode test ou sandbox, ou créez un produit caché à bas prix et un coupon à 100 % que vous pouvez rembourser. Créez un nouveau compte client pour les tests.

Étape 2 : Parcourir et créer un panier

Ouvrez une catégorie, utilisez des filtres et recherchez, puis ouvrez un produit variable. Choisissez ses options, remplissez les champs complémentaires et ajoutez-le au panier. Regardez le mini-chariot ou le nombre de chariots. S'il reste à zéro, un cache de pages sert probablement du contenu stocké. WooCommerce conseils de mise en cache dit d'exclure les pages Panier, Paiement et Mon compte ainsi que ses cookies de session et de panier de la mise en cache.

Étape 3 : Vérifiez les totaux

Appliquez un coupon, entrez une adresse de livraison réelle et comparez les tarifs d'expédition et les taxes avec le même panier sur votre site Web. Ils doivent correspondre exactement, car le même serveur effectue l'arithmétique.

Étape 4 : Payez avec chaque passerelle

Le paiement est l'endroit où une WebView intégrée à l'application est la plus susceptible de différer d'un navigateur de téléphone, alors accordez le plus de temps à cette étape.

• Champs de la carte sur la page, comme ceux de WooPayments ou Stripe, se comportent normalement comme sur le Web mobile. Utilisez une carte de test qui déclenche 3-D Secure et confirmez que le défi apparaît et se termine.
• Passerelles de redirection envoyer le client vers une banque, un portefeuille ou une fenêtre PayPal. Suivez tout le chemin et confirmez que vous arrivez sur la page de réception de votre commande dans l'application, et non dans le navigateur du téléphone avec l'application laissée derrière vous affichant un paiement obsolète.
• Apple Pay et Google Pay les boutons s'affichent uniquement lorsque le script de la passerelle décide que l'environnement les prend en charge, et une WebView intégrée à l'application n'est pas le même environnement que Safari ou Chrome. Google documente les exigences spécifiques pour Google Pay dans Android WebView, et WooPayments publie le sien notes de compatibilité pour le paiement express. Considérez les boutons du portefeuille comme un bonus. Le paiement par carte doit toujours être disponible à côté d'eux.

Vérifiez ensuite que la commande apparaît dans wp-admin avec le bon statut et que l'e-mail de confirmation est arrivé.

Étape 5 : Tester les comptes et les sessions

Inscrivez-vous ou connectez-vous, ouvrez Mon compte et consultez une commande. Fermez ensuite complètement l'application et rouvrez-la. Vous devriez toujours être connecté avec votre panier intact. Demandez une réinitialisation du mot de passe et suivez le lien e-mail pour voir où il s'ouvre et si le retour à l'application a du sens.

Si vous utilisez un plugin de connexion sociale, essayez chaque bouton. Google bloque son écran de connexion dans les WebViews intégrées, donc un bouton "Continuer avec Google" peut afficher une erreur. La connexion par e-mail et par mot de passe est le chemin fiable, alors assurez-vous qu'il est proposé.

Étape 6 : Exécutez le parcours de chaque plugin

Répertoriez les plugins destinés aux clients qui font de votre boutique le vôtre et exécutez un parcours complet pour chacun.

• Subscriptions: achetez-en un, puis suspendez-le, modifiez le mode de paiement et annulez-le depuis Mon compte.
• Bookings: choisissez une date et une heure sur le calendrier de la taille d'un téléphone et finalisez la réservation.
• Vente en gros ou B2B : connectez-vous avec un compte commercial, confirmez les prix commerciaux affichés et passez une nouvelle commande.

Étape 7 : Ranger le cadre

Ignorez la bannière de cookies et toute fenêtre contextuelle de newsletter. Vérifiez que l'en-tête collant, la barre inférieure ou le bouton de discussion flottant de votre thème ne double pas avec l'en-tête et les onglets natifs. SiteTo.App peut exécuter des scripts qui masquent l'en-tête et les fenêtres contextuelles de votre site dans l'application, alors notez tout ce que vous souhaitez supprimer. Si un pare-feu ou un CAPTCHA vous interpelle lors de la connexion, assurez-vous qu'un vrai client peut le transmettre sur un téléphone.

Que devraient vous dire les résultats ?

Que devez-vous configurer dans l’application elle-même ?

Utilisez les parties natives de l'application pour accélérer les achats répétés.

• Onglets inférieurs : Accueil, Boutique ou votre catégorie la plus importante, Panier et Mon compte fonctionnent pour la plupart des magasins. Un magasin qui effectue de nombreuses commandes peut pointer un onglet directement vers /my-account/orders/.
• Insigne du panier : avec l'aide d'un développeur, le Kit de développement logiciel SiteTo.App JS peut regarder une URL sur votre site et afficher le numéro qu'elle renvoie sous forme de badge sur un onglet. WooCommerce Point de terminaison du panier de l'API du magasin renvoie un items_count pour le panier actuel, qu'un développeur peut utiliser comme valeur de badge.
• Push: connectez le Firebase à l'aide du Guide Firebase et décidez à l'avance de ce que vous allez envoyer.

Les modifications de produits, de prix et de stocks dans wp-admin apparaissent dans l'application sans nouvelle version. La modification de l'icône, du nom de l'application ou d'autres paramètres natifs nécessite une reconstruction, et les reconstructions ultérieures sont citées séparément.

Que doivent savoir les magasins WooCommerce avant de publier ?

Vous soumettez l'application à partir de vos propres comptes Apple et Google. SiteTo.App signe la version iOS et la télécharge sur TestFlight dans votre compte Apple, vous n'avez donc pas besoin d'un Mac ou de Xcode, et vous donne un AAB pour Google Play ou un APK. Le créer et publier un guide parcourt chaque étape. Apple et Google décident de ce qui sera approuvé, et personne ne peut promettre le résultat. Ces points reviennent particulièrement dans les magasins WooCommerce.

Les biens physiques utilisent votre propre caisse. Apple Directives d'examen des applications disent que les biens et services consommés en dehors de l’application sont payés par des méthodes autres que l’achat via l’application (section 3.1.3(e)). Un magasin qui expédie des produits repose sur des bases solides.

Les biens numériques sont différents. Le contenu utilisé dans l'application, tel qu'un cours payant, une vidéothèque ou un espace réservé aux membres, relève des règles d'achat via l'application d'Apple dans la section 3.1. Google Play possède sa propre politique de paiement pour les biens numériques intégrés aux applications. Lisez les deux avant de créer si les produits numériques ou les abonnements payants représentent une partie réelle de vos ventes.

Proposer la suppression du compte. Apple s'attend à ce que toute application prenant en charge la création de compte permette aux utilisateurs de commencer à supprimer leur compte depuis l'application. Une page Mon compte WooCommerce par défaut ne propose pas une telle option. Ajoutez-en un avec un plugin ou un formulaire de demande clairement étiqueté.

Donnez aux évaluateurs un accès. Si les prix ou les produits se trouvent derrière une connexion, comme dans de nombreux magasins de gros, fournissez un compte test fonctionnel dans les notes d'évaluation.

Montrez plus qu'un site Web. La directive 4.2 d'Apple demande aux applications d'offrir plus qu'un site reconditionné. Des onglets natifs, un en-tête natif et des notifications push sont utiles, tout comme un magasin avec de réelles fonctionnalités derrière une connexion. Le Guide de la ligne directrice 4.2 explique comment se préparer, et le guide de publication couvre les listes, les captures d'écran et les réponses en matière de confidentialité.

Questions courantes

Dois-je installer un plugin WordPress ?

Pas avec un convertisseur. SiteTo.App fonctionne à partir de l'URL de votre boutique publique, vous n'ajoutez donc pas de plugin à WordPress ni ne créez de clé API REST. Les services d'application basés sur l'API ont généralement besoin d'un plugin compagnon et d'un accès API, car ils lisent directement votre catalogue.

Qu'arrive-t-il à l'application lorsque je mets à jour WooCommerce ou un plugin ?

L'application affiche la boutique mise à jour lors de sa prochaine ouverture, sans nouvelle version. Cela signifie également qu'une mise à jour du plugin qui interrompt votre paiement mobile l'interrompt dans l'application au même moment. Exécutez une commande test rapide sur un téléphone après des mises à jour importantes, comme vous le feriez pour le site Web.

Puis-je d'abord lancer sur Android ?

Oui. Une version Android coûte 29 $ et l'inscription à Google Play coûte 25 $ une fois. L'achat ultérieur de la version iOS coûte 79 $, donc les deux achetés séparément s'élèvent à 108 $ contre 99 $ pour les deux ensemble.

Étape suivante

Ouvrez votre boutique sur votre téléphone et passez une commande test. Si ça se passe bien, prévisualisez votre boutique WooCommerce en tant qu'application gratuitement, exécutez les sept étapes ci-dessus et vérifiez prix une fois qu'on sait que ça marche.