Knowband Blog | Ecommerce Modules

WooCommerce Mobile App Builder – Benutzerhandbuch

Joe Parker

Holen Sie sich vollwertige Flutter-Android- und iOS-Apps für Ihre WooCommerce-Website und beginnen Sie mit dem Verkauf Ihrer Produkte über mobile Apps!

1.0 Beidhändige Rückhand: Einleitung

Dies ist das Benutzerhandbuch für die hochmoderne und vorgefertigte Flutter-Lösung für mobile Apps des WooCommerce Mobile App Builder. Dieses Plugin für E-Commerce-Websites wurde erstellt und fachmännisch entwickelt, um Ihnen bei der Erstellung einwandfreier und funktionsreicher Shopping-Apps für Android und iOS zu helfen.

1.1 Einführung in den WooCommerce Mobile App Builder

Der ausgereifteste und automatisierteste Weg, Ihr Online-Geschäft auf mobile Plattformen auszuweiten, ist die WooCommerce Mobile App Builder. Es verwandelt Ihre gesamte Website in eine mobile App mit Funktionen und ermöglicht Ihnen, Produkte zusätzlich zur herkömmlichen Website auch auf Mobilgeräten zu verkaufen. Die Funktionen und die Bedienung der App spiegeln die der Website perfekt wider und sind sowohl mit Android- als auch mit iPhone-Geräten kompatibel. Das vorkonfigurierte Framework, das von unserem WooCommerce Mobile App Builder verwendet wird, wurde von Experten und Fachleuten erstellt, um zwei Flutter eCommerce-Apps (Android und iOS) zu erstellen. Die Apps können jedem Benutzer jeden Artikel in Ihrem Geschäft zur Verfügung stellen und Umsatz und Ertrag steigern. Daher ist dies Ihre beste Gelegenheit, wenn Sie ein WooCommerce-Händler sind, der nach einer vollständigen Lösung für mobile Apps sucht. Um vollständige Informationen zur Entwicklung mobiler WooCommerce-Apps zu erhalten, lesen Sie den gesamten Artikel. Darüber hinaus ist das Plugin „Multi-vendor Marketplace“ vollständig mit unserer Erweiterung „WooCommerce Mobile App Builder“ kompatibel. Dieselben mobilen Apps können verwendet werden, um auf die gesamte Marktplatzliste zuzugreifen. Noch besser: Wir bieten ein Paket an, das sowohl „WooCommerce Advanced Marketplace With Mobile App“ als auch „WooCommerce Multi-Vendor Marketplace“ enthält. Darüber hinaus würden Sie sich für diese Flutter-App-Lösung entscheiden, wenn Sie die folgenden Vorteile des WooCommerce Mobile App Maker berücksichtigen würden:

  1. Eine mobile App-Lösung ohne Codierung.
  2. Ein einladendes Verwaltungspanel mit vollem Zugriff.
  3. Kostenlose Unterstützung für drei Monate
  4. Komplette Flutter-Lösungen (Android und iOS)
  5. Synchronisation Ihrer Apps und Website zu jeder Zeit
  6. Äußerst flexibel in Gestaltung und Bedienung.
  7. Verwendet praktische Marketingtools, um das Engagement der Benutzer zu steigern.
  8. Steigert den Umsatz und den Verkehr Ihres Geschäfts.

Top-Qualitäten des WooCommerce Mobile App Builders:

Nachfolgend finden Sie eine Liste einiger der wichtigsten Funktionen, die Ihre Apps mit WooCommerce Mobile App Builder enthalten:

Neueste Versionsupdates in WooCommerce Mobile Apps:

Mit einer integrierten Schaltfläche „Zum Warenkorb hinzufügen“ für Produkte auf dem Start- und Kategoriebildschirm wurde die WooCommerce Mobile App für Online-Käufer benutzerfreundlicher gemacht. Durch einfaches Tippen auf die Schaltfläche „Warenkorb“ können Benutzer schnell Produkte zum Warenkorb hinzufügen. Der Kategoriebildschirm mobiler Apps verfügt auch über eine Schaltfläche „Zum Warenkorb hinzufügen“. Benutzer müssen nur zum Ende der Seite scrollen, um die Produkte zu durchsuchen, und können durch Tippen auf die Schaltfläche „Zum Warenkorb hinzufügen“ weitere Artikel zu ihrem Warenkorb hinzufügen.

A) App-Bewertungen für Produkte

Unsere WooCommerce Mobile App ist derzeit mit dem integrierten Produktkommentarmodul von WooCommerce kompatibel. Der Benutzer kann jetzt Produktbewertungen auf der Website veröffentlichen und diese Bewertungen werden auch in der App angezeigt. Der Benutzer kann in der App sowohl Bewertungen lesen als auch schreiben.

b) Verwandte App Store Produkte

Das Modul „Automatische verwandte Produkte“ ist jetzt mit dem WooCommerce Mobile App Builder kompatibel. Auf der Produktseite der Website und der mobilen App können verwandte Produkte angezeigt werden. Diese Kompatibilität kann für Ihr Unternehmen ein wunderbares Werkzeug sein, um Cross-Selling zu steigern.

C) Deep Linking: Eine Deep Linking-Funktion ist integriert in die WooCommerce-Mobile-App. Wenn nun ein Link geteilt wird, wird der Benutzer zur Anwendung und nicht zur Website weitergeleitet. Die einzige Voraussetzung ist die Installation der App auf dem Mobilgerät. Der Benutzer wird durch den geteilten Link sogar zum entsprechenden App-Bildschirm weitergeleitet.

D) Zugänglichkeit im Offline-Modus: Mit dieser Erweiterung funktionieren mobile E-Commerce-Apps jetzt auch ohne Internetverbindung. Benutzer können jederzeit die Seiten durchsuchen, die geladen wurden, während das Internet aktiv war. Produkte, Kategorien, der Warenkorbbildschirm usw.

–> Erkunden WooCommerce DSGVO-Modul

E) Spin & Win (Gamified Email Subscription) Kompatibilität:

Die WooCommerce Spin & Win-Erweiterung ist auch mit dem WooCommerce Mobile App Creator kompatibel. Im Webshop wird durch das spielerische Popup für E-Mail-Abonnements ein interaktives Popup mit Glücksrad bereitgestellt, dessen Anzeige für den Ein- oder Ausstieg geplant werden kann. Dank dieser Integration wird dasselbe Popup nun automatisch in den Apps angezeigt. Die Erweiterung muss nur auf Ihrer Website installiert werden.

F) Video-Banner-Elemente: Der WooCommerce Mobile App Builder von Knowband unterstützt jetzt Videobanner auf der Startseite. Store-Administratoren können Videos direkt hochladen oder YouTube-Videos einbetten, wodurch die Startseite optisch ansprechender wird und das Benutzererlebnis verbessert wird.

G) Listen-/Rasteransicht: Knowbands WooCommerce 2 Native Mobile App Builder für Android und iOS ermöglicht App-Benutzern, beim Durchsuchen von Produkten einfach zwischen Listen- und Rasteransichten zu wechseln. Diese Funktion verbessert das Einkaufserlebnis, indem sie eine flexible und attraktive Möglichkeit bietet, Produkte zu erkunden. Benutzer können mithilfe der Listen-/Rasterschaltfläche auf den Produktlistenseiten zwischen den Ansichten wechseln.

H) Automatisierte Banner-Schieberegler: Der neueste Knowband Magento 2 Mobile App Builder enthält eine automatisierte Banner-Slider-Funktion. Store-Administratoren können das Schiebeintervall ganz einfach über das Backend des Moduls festlegen. Dies ist besonders hilfreich für „Horizontale Banner-Slider“ auf der Startseite, sodass Administratoren sowohl Video- als auch Bildbanner für eine dynamischere und ansprechendere Anzeige hinzufügen können.

I) Erweiterter Überprüfungsbereich: Die Knowband-App für Mobilgeräte verfügt über einen verbesserten Bewertungsbereich. Genehmigte Bewertungen werden mit einer besseren Benutzeroberfläche angezeigt und bieten sowohl Android- als auch iOS-Benutzern ein optisch ansprechenderes und nahtloseres Erlebnis. –> Untersuchen Sie die WooCommerce Spin Win Modul

Dies ist nicht das Ende der Liste. Erfahren Sie mehr über die Funktionen im Detail von diese Seite.

2.0 Demo der WooCommerce-App für Mobilgeräte

KnowBand ist sich Ihrer Bedenken gegenüber der Nutzung der Lösung bewusst und hat allen Besitzern von E-Commerce-Shops eine kostenlose Demo zur Verfügung gestellt, um Ihre Bedenken zu zerstreuen. Die Händler können ihren Shop in unseren Demo-Apps sowie unseren Demo-Shop auf Mobilgeräten in Betrieb sehen.

2.1 Schauen Sie sich unseren Demo-Store für Apps an

Möchten Sie die Funktionen der eCommerce-App sehen? Damit Sie die App erkunden und alle ihre Funktionen sehen können, haben wir unseren Demo-Store darin integriert. Halten Sie sich einfach an die folgenden Richtlinien: Schritt 1: Ihr Mobilgerät kann zum Herunterladen und Installieren der Nautica WooCommerce Mobile App verwendet werden. Im Folgenden finden Sie Links zum Herunterladen von Testversionen der folgenden Apps: Apple App Store – https://testflight.apple.com/join/mrvIRLfw

Google Play Store- https://play.google.com/store/apps/details?id=com.velsof.woocommercegenericapp

Zweitens: Klicken Sie nach dem Starten der Nautica WooCommerce App auf die Schaltfläche „Demo anzeigen“. Jetzt bin ich fertig! In der Demo-App sehen Sie unseren Demo-Shop in Betrieb. Sie können ihn durchsuchen, alle Funktionen testen, Bestellungen aufgeben usw. Hinweis: Jetzt starten um auf das KnowBand Mobile App Builder Admin Panel in unserem Demo-Store zuzugreifen.

2.2 Beobachten Sie den Betrieb Ihres Shops mit Demo-Apps

Nicht zufrieden? Sie möchten die Demo-Apps in Ihrem Shop testen? Wir haben jedoch alles für Sie vorbereitet. Mit unserer Demo-App können Sie Ihren Shop auch kostenlos testen. Sie müssen nur diese 3 Schritte befolgen, um dieselben Ergebnisse zu erzielen:

Siehe beispielsweise https://www.example.com/ Hinweis: Mit diesem Modul werden keine APK- oder IPA-Dateien bereitgestellt. Diese kostenlose Version des Mobile App Builder dient nur zu Demonstrationszwecken. Sie müssen die kostenpflichtige Version des WooCommerce Mobile App Builder kaufen, um Ihre eigenen APK/IPA-Dateien zu erhalten.

3.0 Erstellen Sie in 3 einfachen Schritten eine mobile WooCommerce-App

Wir hoffen, Ihnen hat die Demo der WooCommerce Mobile Apps gefallen und Sie haben gefunden, wonach Sie gesucht haben. Jetzt ist also der perfekte Zeitpunkt, um Ihrem Shop ein paar Flutter-Apps hinzuzufügen. Eine E-Commerce-App für Mobilgeräte lässt sich auf einfachste Weise erstellen. Ihre App ist in nur 3 einfachen Schritten und 1-2 Werktagen fertig.

Vorname, fügen Sie das Modul zu Ihrer Website hinzu. Installieren Sie WooCommerce Mobile App Builder in Ihrem Shop, nachdem Sie es heruntergeladen haben.

Schritt 2: Teilen Sie die Details Ihrer Anwendung. Verwenden Sie unser Voraussetzungen-Formular, um die Spezifikationen Ihrer App mitzuteilen.

Schritt 3: Erhalten Sie Ihre Apps in 1-2 Tagen. Unsere sachkundigen und erfahrenen Entwickler erstellen Ihre Apps genau nach den mitgeteilten Details. Innerhalb von 1-2 Tagen antworten wir mit APK/IPA-Dateien. Hinweis: Diese APK/IPA-Dateien können in den entsprechenden App Stores veröffentlicht werden. Immer noch ein Problem? Sagen Sie es uns und wir helfen Ihnen bei der Veröffentlichung der Apps. Darüber hinaus können Sie uns unter support@knowband.com kontaktieren, wenn Sie Fragen oder Anregungen haben.

4. Installation des Moduls

Nach dem Kauf des WooCommerce Mobile App Builder-Moduls erhalten Sie die unten aufgeführten Dateien: 1. ZIP-formatierte komprimierte Datei (enthält den Quellcode des Add-Ons) 2. Benutzerhandbuch

Sie können den Installationsvorgang nun auf eine der beiden unten aufgeführten Arten fortsetzen:

Details zur Modulinstallation über FTP Installieren eines Moduls mit Administratordaten

5.0 Bildschirme für das Admin-Panel

Nachdem das Admin-Panel des WooCommerce Mobile App Creator erfolgreich auf Ihrer Website installiert wurde, ist es an der Zeit, es einzurichten. Sobald Sie im KnowBand Mobile App Builder die Option „Konfigurieren“ auswählen, wird Ihnen die folgende Registerkarte mit benutzerfreundlichen Oberflächen angezeigt. Lassen Sie uns jeden Tab einzeln löschen.

5.1 Allgemeine Einstellungen:

Die Einstellungen, die für die Geräte der Benutzer zum Ausführen Ihrer mobilen App erforderlich sind, finden Sie alle auf der Registerkarte „Allgemeine Einstellungen“. Diese Registerkarte enthält alle allgemeinen Optionen, die zum Synchronisieren der App erforderlich sind.

A) Plugin aktivieren: Damit Ihre mobile App auf den Geräten der Benutzer funktioniert, aktivieren Sie das Plugin WooCommerce Mobile App Creator. B) Drehen und Gewinnen aktivieren: Wenn ein Benutzer die App öffnet, aktivieren Sie die Anzeige eines spielerischen Glücksrad-Popups auf dem Startbildschirm. Damit können Rabatte und Angebote im Austausch gegen die E-Mail-Adressen der Benutzer angeboten werden, die dann für Marketingzwecke verwendet werden. Damit diese Funktion funktioniert, muss das Spin and Win-Modul von Knowband auf Ihrer Website installiert sein. Das Spin and Win-Modul funktioniert nur, wenn das Plugin auf der Seite Ihres Shops installiert wurde. C) Weiterleitung auf der Warenkorbseite beim Hinzufügen zum Warenkorb: Mit dieser Funktion können Sie die Navigation der Schaltfläche „In den Warenkorb“ verwalten. Wenn ein Benutzer auf die Schaltfläche „In den Warenkorb“ tippt, haben Sie die Möglichkeit, ihn zum Warenkorb zu schicken oder ihn auf der Produktseite zu halten. Dies erhöht die Wahrscheinlichkeit, dass er weitere Käufe tätigt. D) Kurzbeschreibung anzeigen: Lassen Sie zu, dass die Kurzbeschreibung des Produkts neben der vollständigen Beschreibung und anderen Informationen auf dem Produktbildschirm angezeigt wird.

E) Wählen Sie Layout: Wählen Sie das gewünschte Startseitenlayout für Ihre WooCommerce-App. Je nach Feiertagen und Themen können Sie im Backend verschiedene Startseitenlayouts erstellen und diese nach Bedarf für Ihren Shop verwenden. Wählen Sie unter Option F) die gewünschte Schaltflächenfarbe für Ihre WooCommerce Mobile App. App-Designfarbe: Wählen Sie die bevorzugte Themenfarbe Ihrer WooCommerce Mobile App. G) Logo Bild: Platzieren Sie das Logo Ihres Shops in der Kopfzeile der App, indem Sie es hochladen. Dadurch wird Ihre Marke bei mobilen Kunden weltweit bekannter. H) Deaktivierte Versandmethoden: Wählen Sie die Versandoptionen aus, die in der WooCommerce Mobile App ausgeblendet werden sollen. I) Aktivierte CMS-Seiten: Wählen Sie die CMS-Seiten aus, die in mobilen Apps angezeigt werden sollen. J) Anforderungsprotokollberichte aktivieren: Aktivieren Sie die Protokollfunktion für mobile Apps, um mehr über ungewöhnliches Verhalten Ihrer App zu erfahren. K) WhatsApp-Chat-Support aktivieren: Aktivieren Sie in Ihren WooCommerce Mobile Apps die WhatsApp-Chat-Option. Ihre im Backend eingegebene WhatsApp-Nummer kann von Benutzern verwendet werden, um direkt mit Ihnen in Kontakt zu treten. L) Telefonnummernregistrierung aktivieren/deaktivieren: Aktivieren Sie in Ihrer WooCommerce Mobile App die Anmeldeoption „Telefonnummer“ und aktivieren Sie die OTP-Authentifizierung für Ihre Benutzer. M) URL-Kodierung für Bildlinks aktivieren: Aktivieren Sie diese Funktion, damit die App andere Zeichen als ASCII unterstützt.

N) Schaltfläche „Zum Warenkorb hinzufügen“ im Produktblock anzeigen: Mithilfe dieser Schaltfläche kann der Administrator die Schaltfläche „Zum Einkaufswagen hinzufügen“ für die Produktlistenseiten ein-/ausblenden.

O) Benachrichtigungslistenfunktion aktivieren: Mit der Schaltfläche kann der Administrator die Benachrichtigungslistenfunktionen für die App-Benutzer aktivieren. Wenn diese Option deaktiviert ist, wird die Registerkarte „Benachrichtigung“ nicht in der App angezeigt.

P) Anmelde-Popup aktivieren: Mit dieser Option kann der Administrator das Anmelde-/Registrierungs-Popup für Neukunden aktivieren oder deaktivieren.

5.2 Einstellungen für Push-Benachrichtigungen

Die Google Primary Services für Push-Benachrichtigungen an Mobilgeräte werden vom WooCommerce Mobile App Creator für Android und iOS verwendet, um die Leistungsfähigkeit von Push-Benachrichtigungen zu nutzen. Es bietet dieses praktische Marketingtool, um den Umsatz zu steigern, indem die Aufmerksamkeit der Benutzer sofort erregt wird. Mithilfe Ihrer WooCommerce Mobile App können Sie ganz einfach Ihre aktuellen Sonderangebote und Angebote hervorheben. WooCommerce Mobile App Maker bietet sowohl automatisierte als auch benutzerdefinierte Benachrichtigungen.

A) Dienstkonto JSON: Mit der Abschaffung der herkömmlichen Firebase-Push-Messaging-API wurde diese durch eine JSON-Datei für Servicekonten ersetzt. In diesem Abschnitt können Administratoren die JSON-Datei von ihrem Firebase-Konto aus konfigurieren. Sie können sie entweder selbst einrichten, oder wir können Ihnen die JSON-Datei für Servicekonten während des App-Erstellungsprozesses zur Verfügung stellen. B) Benachrichtigung bei Auftragserstellung aktivieren/deaktivieren: Aktivieren/Deaktivieren Sie die automatische Push-Benachrichtigung, die an App-Benutzer gesendet wird, wenn eine Bestellung erfolgreich erstellt wurde. –> Titel und Nachricht für Push-Benachrichtigung: Um eine Bestellung erfolgreich zu erstellen, geben Sie den Titel und die Nachricht in die Push-Benachrichtigungseinstellung ein. C) Benachrichtigung über geänderten Bestellstatus: Benutzer der App können wählen, ob sie automatische Push-Benachrichtigungen erhalten möchten, wenn sich der Lieferstatus ihrer vorherigen Bestellung ändert. -> Titel und Nachricht für Push-Benachrichtigung: Geben Sie in den Push-Benachrichtigungseinstellungen den Titel und die Nachricht ein, wenn der Lieferstatus einer früheren Bestellung aktualisiert wird. D) Benachrichtigung bei abgebrochenem Einkaufswagen aktivieren/deaktivieren: Aktivieren/Deaktivieren Sie automatische Push-Benachrichtigungen, die an Benutzer gesendet werden, deren Einkaufswagen verlassen wurden, aber kein erfolgreicher Kauf getätigt wurde. Geben Sie den Titel und die Nachricht für die Push-Benachrichtigung ein, die an App-Benutzer gesendet wird, die ihren Einkaufswagen verlassen haben. E) Zeitintervall: Die Zeitspanne (in Stunden), zwischen der App-Benutzer, die ihren Einkaufswagen ohne Kauf verlassen haben, Push-Benachrichtigungen erhalten.

5.3 Verlauf der Push-Benachrichtigungen

Diese Registerkarte enthält einen Verlauf aller Push-Benachrichtigungstypen, die mit relevanten Informationen an einen Benutzer gesendet wurden. Der Einzelhändler hat Zugriff auf alle zuvor gesendeten Benachrichtigungen. Darüber hinaus kann über diese Registerkarte eine im Backend erstellte benutzerdefinierte Benachrichtigung an die Benutzer gesendet werden. Durch manuell gesendete Benachrichtigungen können Sie Kunden problemlos über alle Informationen oder Rabatte informieren, die das Geschäft betreffen.

Benachrichtigung senden: Mit dieser Option können Sie manuell eine Benachrichtigung an App-Benutzer senden. Gemäß dem Screenshot unten können Sie den Titel, die Nachricht, die Zielseite, das Bild usw. der Benachrichtigung anpassen.

a) Titel der Push-Benachrichtigung: Dies ist der Name der manuellen Push-Benachrichtigung, die Sie an App-Benutzer senden. b) Push-Benachrichtigungsnachricht: Der Text Ihrer manuellen Benachrichtigung, die an App-Benutzer gesendet werden muss. c) Gerätetyp: Sie können angeben, welche Benutzer auf Android, iOS oder beiden Plattformen Ihre manuelle Push-Benachrichtigung erhalten sollen. d) Bildtyp: Sie können das Banner oder Bild hochladen, das Sie zur Unterstützung Ihrer Benachrichtigung verwenden möchten. Das Bannerbild kann direkt über eine URL verwendet oder hochgeladen werden. e) Benachrichtigungsbild: Der Store-Administrator hat die Möglichkeit, eine Vorschau des Benachrichtigungsbildes anzuzeigen und zu beurteilen, wie es in den Apps der Benutzer angezeigt wird. Die tatsächliche URL des Benachrichtigungsbildes, das an die App-Benutzer gesendet wird, ist unter Punkt f aufgeführt. f) Umleitungsaktivität: Hier können Sie zwischen dem Startbildschirm, einer beliebigen Kategorie oder einem beliebigen Produkt wählen, um Ihre Benachrichtigung umzuleiten. Ihre Benutzer werden zu der von Ihnen angegebenen Adresse weitergeleitet, wenn sie auf die Push-Benachrichtigung tippen. g) Wählen Sie die Kategorie/das Produkt: Für Ihre Benachrichtigung können Sie jeden relevanten Kategorie-/Produktbildschirm auswählen. h) Benachrichtigung senden: Nachdem Sie Ihre Benachrichtigung erstellt und in der Vorschau angezeigt haben, ist es Zeit, sie an Ihre Apps zu senden.

5.4 Zahlungsmodalitäten

Der WooCommerce Mobile App Creator für Android- und iOS-Apps unterstützt alle Arten von Website-Zahlungsmethoden. Er beinhaltet auch die Option für Nachnahmezahlungen und die Flexibilität, zusätzliche Web-View-Zahlungsmethoden einzubinden. In unserer mobilen App ist standardmäßig nur die Zahlung per Nachnahme verfügbar. Deaktivieren Sie die Nachnahmemethode jedoch im Backend des Moduls, wenn Sie dieselben Zahlungsmethoden wie in Ihrem WooCommerce-Shop hinzufügen möchten. Alle auf Ihrer Website verfügbaren Zahlungsoptionen funktionieren in Ihren mobilen Apps wie vorgesehen, nachdem die Nachnahmemethode deaktiviert wurde.

5.5.1 Gestaltung der Startseite

Die Fähigkeit des WooCommerce Mobile App Builder-Plugins, mehrere Startbildschirm-Layouts mit unterschiedlichen Designattributen und -elementen zu entwerfen und zu erstellen, ist eine seiner erstaunlichsten Funktionen. Wie im folgenden Screenshot zu sehen ist, enthält diese Registerkarte eine Liste von Startbildschirm-Layouts, die zuvor mit verschiedenen Designs und Schriftarten konfiguriert wurden:

Um das Homepage-Layout zu konfigurieren stehen Ihnen im Backend folgende Elemente zur Verfügung:

Jedes dieser Attribute kann vom Händler im Shop eingerichtet und zum Erstellen und Speichern mehrerer Layouts verwendet werden. Diese Layouts können je nach Thema und Spezifikationen verwendet werden. Darüber hinaus können die Positionen verschiedener Elemente mithilfe einer Drag-and-Drop-Funktion geändert werden.

Top Kategorien:

Top-Kategorien können konfiguriert werden, einschließlich ihrer Bilder und Zielkategorien oder Produkte, und werden als kleine Quadrate auf dem Startbildschirm angezeigt. Über den WooCommerce Mobile App Maker sind maximal 8 Kategorien verfügbar, mindestens 4 sind erforderlich.

Quadratisches Banner:

Top-Kategorien können konfiguriert werden, einschließlich ihrer Bild- und Zielkategorien oder Produkte, und werden als kleine Quadrate auf dem Startbildschirm angezeigt. Die maximale Anzahl an Kategorien, die über den WooCommerce Mobile App Maker verfügbar sind, beträgt 8, wobei mindestens 4 erforderlich sind. In den letzten Updates haben wir auch die Möglichkeit bereitgestellt, verschiedene Videos mit dem Abschnitt „YouTube-Video/Video-Upload“ zu präsentieren, der im Abschnitt „Bildtyp auswählen“ hinzugefügt wurde.

Horizontal verschiebbares Banner:

Diese rechteckigen Schiebetüren sind im Backend verfügbar und vollständig anpassbar. Wie bei Bannerquadraten kann der Administrator auch die Bannerschieber hervorheben, indem er Videoelemente hinzufügt. Darüber hinaus hat der Administrator jetzt die Möglichkeit, die Zeit einzugeben, die er für das automatische Verschieben der Banner festlegen möchte.

Rasterbanner:

Dabei handelt es sich um quadratische Banner, die in einem Rasterformat auf dem Startbildschirm aufgelistet sind. Auf dem Startbildschirm können Sie beliebig viele Banner platzieren. Sie können das Bild der Zielseite auch nach Bedarf ändern.

Countdown-Timer-Banner:

Auf dem vom WooCommerce Mobile App Builder bereitgestellten Banner ist ein Countdown-Timer verfügbar. Sie können die Zielseite und das Bannerbild auswählen sowie einen Timer festlegen, wann das Banner angezeigt werden soll. Das Banner verschwindet automatisch, wenn der Timer abgelaufen ist.

Square-Produkte:

In Bezug auf Banner bietet der WooCommerce Mobile App Creator die Möglichkeit, Produkte als quadratische Listen auf dem Startbildschirm anzuzeigen.

Horizontale Schiebeprodukte

Die Produkte können als horizontale Schieberegler hinzugefügt werden. Die ausgewählten Produkte können in eine bestimmte Kategorie fallen oder als Bestseller, empfohlene Produkte usw. hervorgehoben werden.

Grid-Produkte:

Auch Rasterauflistungen der Produkte können dem Homescreen hinzugefügt werden. Zur Auswahl der Waren können beliebige Kategorien verwendet werden.

Kürzlich angesehene Produkte: Der WooCommerce Mobile App Creator bietet das Tab-Element „Zuletzt verwendet“, das die zuletzt vom Benutzer angesehenen Produkte anzeigt. Um das Element auf Ihrem Startbildschirm anzuzeigen, fügen Sie es einfach in Ihr Layout ein.

Anmelde-Popup: Das Erfassen der E-Mail-Adressen von Besuchern ist im E-Commerce eine große Herausforderung. Um dies zu vereinfachen, enthält die neueste Version des Magento 2 Mobile App Builder eine Popup-Funktion für die Anmeldung/Registrierung. Store-Administratoren können ein Popup hinzufügen, das für nicht angemeldete Kunden angezeigt wird. Dies erleichtert das Erfassen von E-Mails, indem einfache Anmeldeoptionen angeboten und die Chancen auf E-Mail-Opt-Ins erhöht werden. Hinweis: Beim Entwerfen eines Layouts im Backend-Bereich kann der Store-Administrator bis zu 20 Elemente hinzufügen.

6.0 Bildschirme für mobile Apps

6.1-Startbildschirm

Der Startbildschirm Ihrer WooCommerce Mobile App wird genau so aussehen, wie Sie ihn haben möchten. Mit dem WooCommerce Mobile App Maker haben Sie die vollständige kreative Kontrolle über die Gestaltung und Erstellung eines Startbildschirms. Sie können benutzerfreundliche Startbildschirmlayouts mithilfe einer Vielzahl von Bannern (Quadrat, Raster, Gleiten), Produkten (Quadrat, Raster, Gleiten), Countdown-Timer-Bannern und Registerkarten für aktuelle Produkte im Backend erstellen.

 

Darüber hinaus kann die Platzierung verschiedener Designelemente je nach Situation geändert werden. 1. Dynamische Layouts: Du kannst im Backend verschiedene Layouts erstellen und speichern und diese durch die Verwendung verschiedener Elemente für verschiedene Events und Festivals wiederverwenden. Der Homescreen deiner App kann dynamisch erstellt und angepasst werden. 2. Markenlogo: Der linke mittlere Abschnitt der oberen Kopfzeile der WooCommerce Mobile App zeigt das Logo Ihres Shops. Das Logo kann im Backend des Moduls aktiviert oder deaktiviert sowie sein Bild geändert werden. 3. Suche: Mit der Suchfunktion können Benutzer mobiler Apps schnell und einfach finden, wonach sie suchen. Die WooCommerce Mobile App bietet zwei Möglichkeiten, nach Produkten zu suchen: Im unteren Tab-Leistenlayout der WooCommerce Mobile App gibt es eine Suchoption. –> Text: Benutzer Ihrer App können nach gewünschten Produkten suchen, indem sie einige relevante Schlüsselwörter eingeben. Die WooCommerce Mobile App zeigt die für dieses Schlüsselwort relevanten Ergebnisse an. 4. Wunschliste Tasche: Die Wunschlistentasche, die alle mit Lesezeichen versehenen Produkte enthält, ist in der oberen Kopfzeile Ihrer WooCommerce Mobile App sichtbar. Benutzer der App können ihre Wunschlistenartikel für mögliche zukünftige Einkäufe in einer Tasche aufbewahren. 5. Warenkorb: Der Einkaufswagen befindet sich auf dem Startbildschirm der App in der oberen rechten Ecke. Die Benutzer können sich direkt von dort aus über die Produkte informieren, die in ihren Einkaufswagen gelegt wurden. 6. WhatsApp:

Unten rechts auf dem Startbildschirm finden Sie eine Live-Chat-Option für Verkäufer und Käufer. Kunden, die Ihre mobile App verwenden, können Ihnen ganz einfach und direkt Nachrichten mit Fragen senden und Sie können diese sofort beantworten.

6.2.1 Ein Akkordeonmenü (Navigationsleiste)

Auf der Website gibt es WooCommerce Mobile Apps für Android und iOS, die mit genauer Produktkategorisierung entwickelt wurden. Mobile Käufer können problemlos eine Vielzahl von Produkten durchsuchen. Das Akkordeonmenü ist auch für alle CMS-Seiten verfügbar. Es bietet die folgenden Alternativen:

 

1. Mein Konto

Alle Benutzerdaten, einschließlich persönlicher Daten, Lieferadressen und Bestelldetails, finden Sie auf dem Bildschirm „Mein Konto“. Die Kunden haben Zugriff auf alle ihre Informationen und können sowohl ihre Anmeldeinformationen als auch ihre persönlichen Daten aktualisieren. 2. Kategorien

Diese Kategorien entsprechen genau denen auf Ihrer Website. Um das Browsen zu erleichtern, können Sie sie entsprechend zuordnen und App-Benutzern eine dreistufige Kategorisierung bereitstellen. 3. CMS-Seiten

Hier werden verschiedene CMS-Seiten Ihrer Website angezeigt, darunter „Über uns“, „Kontakt“, „Allgemeine Geschäftsbedingungen“ usw. Im Backend des WooCommerce Mobile App Builder können Sie die Seite auswählen, die in der mobilen App angezeigt werden soll. 4. Sprache

Ihre Benutzer können die WooCommerce Mobile-App mithilfe der Sprachauswahloption in ihrer Muttersprache anzeigen. 5. Währung(en)

Die WooCommerce Mobile App zeigt auch alle Währungen an, die auf Ihrer E-Commerce-Website angeboten werden. Kunden können Produkte zum Preis in der Währung ihrer Wahl ansehen und kaufen. 6. Anmelden/Abmelden

Diese Option erleichtert Ihren Benutzern das An- und Abmelden bei der WooCommerce Mobile App.

6.3 Kategoriebildschirm:

Ihre WooCommerce Mobile App enthält alle zugehörigen Kategorien, übergeordneten Kategorien und Unterkategorien. Der Kategoriebildschirm wird mit minimaler Unordnung erstellt in

1.Zwei grundlegende Ansichten: Raster und Liste. In jeder Auflistung werden Produktname, Bild, Preis und Rabatt zusammen mit einer Schaltfläche zum Hinzufügen zu Ihrer Wunschliste angezeigt. Die geschichtete Navigation in mobilen Apps, die mit dem WooCommerce Mobile App Builder erstellt wurden, erleichtert das Auffinden von Produkten erheblich. Die Kategoriebildschirme bieten die folgenden Auswahlmöglichkeiten:


2. Sortieren:

Mit dieser Option können Kunden die bevorzugte Reihenfolge für die Sortierung der Kategorieproduktpreise auswählen. Ihre Apps haben zwei Sortieroptionen: Preis: Niedrig bis Hoch und Preis: Hoch bis Niedrig.

3. Filter:

Die Benutzer können die Produkte mithilfe verschiedener Auswahloptionen herausfiltern, die unter der Registerkarte „Filter“ bereitgestellt werden.

6.4 Produktbildschirm:

Der Produktbildschirm Ihrer WooCommerce Mobile App ist übersichtlich und interessant. Neben dem Namen und dem Preis werden verschiedene Bilder desselben Artikels angezeigt. Je nach Lagerstatus wird die Produktverfügbarkeit auch als „Auf Lager“ oder „Nicht auf Lager“ angezeigt. Es werden die nächsten zusätzlichen Artikel angezeigt.

1. Optionen

Produktoptionen: Dieser Bildschirm zeigt alle verfügbaren Optionen für das Produkt, einschließlich Größe, Farbe usw. Die hier angezeigten Produktoptionen entsprechen denen auf der Website.

2. Kurze Beschreibung

Benutzer können nach dem Lesen der Kurzbeschreibung Ihres Produkts schnell eine Entscheidung treffen.

3. Produktdetails und Pflege

Auf dieser Seite werden alle Produktinformationen angezeigt, die auf der Website aufgeführt sind. Benutzer der App können auf diese Seite zugreifen, um detaillierte Produktinformationen zu erhalten.

4. Zur Wunschliste hinzufügen: Durch Tippen auf „Zur Wunschliste hinzufügen“ unten links auf dem Produktbildschirm können Benutzer der mobilen App das Produkt direkt mit einem Lesezeichen versehen.

5. In den Warenkorb: Wie der Name schon sagt, wird das Produkt durch Klicken auf die Schaltfläche „Zum Warenkorb hinzufügen“ direkt in den Warenkorb gelegt, sodass Benutzer mit der Transaktion fortfahren können.

6. Produkte in sozialen Netzwerken teilen

Auf diesem Bildschirm haben Sie die Möglichkeit, Ihr Produkt in verschiedenen sozialen Netzwerken, einschließlich Bluetooth und E-Mail, zu teilen. Benutzer der App können viele Benutzer zu Ihrer App einladen, indem sie die Produkte mit ihren Freunden und ihrer Familie auf verschiedenen Social-Media-Plattformen teilen.

6.6-Anmeldebildschirm

Der WooCommerce Mobile App Creator vereinfacht den Anmelde-/Registrierungsprozess und bietet eine Vielzahl von Anmeldeoptionen mit nur einem Fingertipp:

1. Anmeldung

Mit ihrer E-Mail-Adresse als Anmeldeinformationen können App-Benutzer sich authentifizieren und auf Apps zugreifen.

2. Registrieren

Die mobile App ermöglicht allen neuen App-Benutzern, sich zu registrieren und ein Konto im Store zu erstellen. Im Anmeldeformular der WooCommerce Mobile App werden nur relevante Informationen abgefragt.

3. Verwenden Sie die Telefonnummer zum Anmelden

Die einfachere und zuverlässigere Anmeldeoption per Telefonnummer, die Ihre mobile App bietet, erleichtert Benutzern die Anmeldung und Überprüfung ihres OTP.

4. Melden Sie sich mit Ihrem Fingerabdruck an

Darüber hinaus haben Ihre Benutzer die Möglichkeit, sich per Fingerabdruck-Authentifizierung anzumelden. Dadurch können Benutzer nun schnell auf Apps zugreifen.

5. Mit Facebook einloggen

Benutzer können auf die App zugreifen, indem sie sich mit ihren Facebook-Anmeldedaten anmelden.

6. Melden Sie sich mit Google an

Die Nutzer können sich innerhalb kürzester Zeit mit ihrem Google-Konto bei der App anmelden.

7. Warenkorb-Bildschirm:

Alle Artikel in Ihrem Einkaufswagen werden auf dem Einkaufswagenbildschirm der WooCommerce Mobile App angezeigt. Der Name, die Menge, der Gesamtpreis und die Versandkosten des Produkts sind für App-Benutzer sichtbar.

1.Gutschein verwenden

Durch die Eingabe aktiver Coupons und Gutscheine, die derzeit auf Ihrer Website aktiv sind, können Benutzer mit dieser Option Rabatte und Angebote erhalten.

2. Die vollen Produktkosten

Auf dieser Seite können Benutzer den Gesamtpreis ihres Einkaufskorbs einsehen. Die Seite wird automatisch aktualisiert, wenn sich die Menge eines Produkts ändert oder ein Artikel hinzugefügt wird.

3. Überarbeitung der Produktmenge

Mit der Option „Menge aktualisieren“ können App-Nutzer sogar die Produktmenge ändern.

4. Entfernen Sie den Artikel

Benutzer der App können ein Produkt einfach aus ihrem Warenkorb entfernen, indem sie im Menü „Entfernen“ auswählen.

6. Weiter zur Kasse

Durch Auswahl von „Weiter zur Kasse“ können Benutzer der Front-End-App mit den Kassen- und Zahlungsbildschirmen fortfahren. Auf dem Kassenbildschirm werden sie weitergeleitet.

6.8 Bezahlvorgang

Der Checkout-Prozess im WooCommerce Mobile App Builder ist einfach gestaltet. Im Checkout-Prozess der mobilen App haben Frontend-Benutzer die Möglichkeit, Versanddetails, Rechnungsdetails, Bestellnummern, Bestellkommentare usw. auszuwählen.

Über die Android- und iOS-Apps können Bestellungen in nur wenigen einfachen Schritten aufgegeben werden. 1. Kunden können den gewünschten Artikel auswählen und in ihren Einkaufswagen legen. Beim Anklicken des Einkaufswagens kann der Benutzer auch die gewünschte Produktmenge auswählen. Benutzer der mobilen Front-End-App können auch die Gesamtzahl der Produkte und die Versandkosten sehen. Unten auf derselben Seite kann der Kunde auch einen beliebigen Coupon oder Couponcode verwenden. 2. Der Benutzer kann die Bestellung überprüfen und sich nach Auswahl der Option „Zur Kasse gehen“ verschiedene Details ansehen, wie beispielsweise die Kosten des Produkts, die Versandkosten, die Lieferadresse (die auf derselben Seite geändert werden kann), die Bestellübersicht (die Anzahl der Produkte), die Gesamtkosten usw. Auf derselben Seite kann der Kunde auch seine bevorzugte Versandmethode wählen. Die Option für Bestellkommentare, die unten auf dem Bildschirm erscheint, ermöglicht es dem Benutzer, auch Sonderwünsche oder Anforderungen anzugeben.

3. Nachdem der Benutzer die Option „Zur Kasse gehen“ ausgewählt hat, wird er zum Bildschirm weitergeleitet, auf dem er nach seiner Zahlungsmethode gefragt wird.

Auf diesem Bildschirm können Benutzer aus allen Zahlungsoptionen der Website wählen. Die Shopping-App bietet als Standardzahlungsmethode die Option „Nachnahme“. Nach Abschluss der Zahlung wird der Benutzer zum Bestellübersichtsbildschirm weitergeleitet, wo der Kunde den Status, die Kosten und andere Informationen zu seinen Bestellungen einsehen kann. Benutzer der Front-End-Mobil-Apps erhalten die Popup-Nachrichten zur Bestellbestätigung auch auf dem Bildschirm ihres Mobiltelefons.

6.9 Bildschirm „Mein Konto“.

Benutzer der Android/iOS eCommerce-App können alle Kontoinformationen, einschließlich eines Verlaufs früherer Bestellungen, auf dem Bildschirm „Mein Konto“ anzeigen. Auf dem Bildschirm „Mein Konto“ sind die folgenden Optionen verfügbar:

  1. Bestellverlauf

Die Benutzer erfahren alle Details der zuvor aufgegebenen Bestellung. Das Datum der Bestellung, die Bestellnummer, der Preis und der Lieferstatus sind alle auf dem Benutzerbildschirm sichtbar.

2. Profil aktualisieren:

Benutzer können auch ihre zuvor gespeicherten Profilinformationen wie Vor- oder Nachnamen, Telefonnummer und Passwort aktualisieren.

3. Lieferadresse(n)

Nutzer der App haben Zugriff auf die vollständige Liste der gespeicherten Lieferadressen. Von hier aus können Sie auch eine neue Lieferadresse hinzufügen.

4. Bestelldetails:

Den App-Nutzern steht die vollständige Liste ihrer bisher getätigten App-Bestellungen zur Verfügung.

5. Nachbestellfunktion

Über die Schaltfläche „Nachbestellen“ können Sie ein Produkt direkt nachbestellen. Mit einem einzigen Tastendruck werden alle vorherigen Bestellungen in den Warenkorb gelegt.

6.10 Bestelldetailbildschirm

Der Bestelldetails-Bildschirm der WooCommerce eCommerce App zeigt alle Aspekte der Bestellung an, einschließlich der Lieferadresse, einer Zusammenfassung der Produkte, der Versand- und Zahlungsoptionen und der Gesamtkosten. Von diesem Bildschirm aus können Benutzer sogar die Lieferung zuvor aufgegebener Bestellungen verfolgen.

7.0 Video-Tutorials