Adobe empfiehlt die Verwendung des SPA-Editors für Projekte, für die ein frameworkbasiertes clientseitiges Rendering für einzelne Seiten (z. B. React) erforderlich ist. Weitere Informationen
Der Entwicklungsprozess für AEM mobile Anwendungen erkennt, dass Benutzer mit unterschiedlichem Fachwissen zur Entwicklung von mobilen Anwendungen beitragen. Die folgende Prozesszuordnung veranschaulicht die allgemeine Reihenfolge, in der Inhaltsersteller und Anwendungsentwickler Aufgaben durchführen.
Informationen zur Durchführung der Marketing-Aufgaben finden Sie auf dieser Seite. Weitere Informationen zu den Developer-Aufgaben finden Sie unter Erstellen von PhoneGap-Anwendungen.
AEM Mobile stellt den Phonegap App-Entwurf zum Erstellen von Mobilanwendungen bereit. Der Entwurf definiert die Struktur der von Ihnen erstellten Anwendungen. Anträge umfassen die folgenden Elemente:
Die Stammeseite der mobilen Anwendungen, die Sie in AEM erstellen, wird in der Apps-Konsole angezeigt.
Die Stammeseite wird unter der Eigenschaft Zielpfad der Anwendung gespeichert, die beim Erstellen der Anwendung angegeben wurde (der Standardpfad lautet /content/phonegap/apps). Der Seitenname ist die Name-Eigenschaft der Anwendung. Die Standard-URL der Stammseite der Site myphonegapapp
lautet beispielsweise http://localhost:4502/content/phonegap/apps/myphonegapapp.html
.
Die ersten untergeordneten Seiten der Stammseite sind die Sprachvarianten der Anwendung. Der Name jeder Seite ist die Sprache, für die die Anwendung erstellt wird. Beispielsweise ist Englisch der Name der englischen Variante des Antrags.
Hinweis: Der standardmäßige PhoneGap-Blueprint erstellt nur eine englische Anwendung. Ihr Entwickler kann den Entwurf so ändern, dass er weitere Sprachvarianten erstellen kann.
Die Sprachseite dient zwei Zwecken:
Die Startseite oder die Seite "index.html"einer Sprachvariante einer Anwendung wird beim Öffnen der Anwendung angezeigt. Die Startseite bietet den Benutzern ein Menü mit Links zu verschiedenen Seiten der Anwendung. Mit dem Absatzsystem können Sie Komponenten zur Seite hinzufügen, um Inhalte zu erstellen.
Mobile Anwendungen basieren auf einem Entwurf, der eine Seitenstruktur und Eigenschaften definiert. Sie können die folgenden Anwendungseigenschaften konfigurieren:
Sie können auch eine Bilddatei angeben, die als Anwendungsminiaturansicht verwendet werden soll, die zu verwendende PhoneGap Build auswählen und die zu verwendende Mobile App Analytics-Konfiguration auswählen. Dieses Bild wird nur als Miniaturansicht für Ihre Mobilanwendung in der App-Konsole in Experience Manager verwendet.
Zusätzliche (und optionale) Registerkarten sind vorhanden, um den Cloud-Dienst zu erstellen und das Adobe Mobile Services SDK-Plug-In in Ihre App zu integrieren.
Entwickler können das AEM PhoneGap Starter Kit verwenden, um Apps zu erstellen und sie der Konsole hinzuzufügen.
Im folgenden Verfahren wird die Touch-Benutzeroberfläche zum Erstellen einer mobilen Anwendung verwendet.
Klicken Sie in der Leiste auf Apps.
Klicken oder tippen Sie auf das Symbol Erstellen.
(Optional) Geben Sie auf der Registerkarte "Erweitert"eine Beschreibung für die Anwendung ein und ändern Sie bei Bedarf die Server-URL.
(Optional) Wenn Sie die Anwendung mithilfe von PhoneGap Build kompilieren kompilieren, wählen Sie auf der Registerkarte "Erstellen"die zu verwendende Konfiguration aus.
Um eine PhoneGap-Buildkonfiguration zu erstellen, klicken Sie auf Konfigurationen verwalten.
(Optional) Wenn Sie SiteCatalyst zur Verfolgung der Anwendungskonfiguration verwenden, wählen Sie auf der Registerkarte "Analytics"die zu verwendende Aktivität aus.
Um eine Mobile App-Konfiguration zu erstellen, klicken Sie auf Konfigurationen verwalten.
(Optional) Um ein Anwendungssymbol bereitzustellen, klicken Sie auf die Schaltfläche "Durchsuchen", wählen Sie die Bilddatei im Dateisystem aus und klicken Sie auf "Öffnen".
Klicken Sie auf Erstellen.
Nachdem Sie eine Mobilanwendung erstellt haben, können Sie die Eigenschaften ändern.
Klicken Sie in der Leiste auf oder tippen Sie auf Apps.
Wählen Sie die zu konfigurierende Ansicht aus und klicken Sie auf das Symbol Seiteneigenschaften.
Um die Eigenschaftswerte zu ändern, klicken Sie auf das Symbol Bearbeiten oder tippen Sie darauf.
Konfigurieren Sie die Eigenschaften "Einfach"und "Erweitert"und klicken Sie dann auf das Symbol "Fertig".
Klicken Sie in der Leiste auf oder tippen Sie auf Apps.
Klicken Sie auf , um einen Drilldown für die mobile Anwendung durchzuführen, die Sie in der Admin-Konsole von Apps bearbeiten möchten. Wählen Sie die zu konfigurierende Sprachversion der Ansicht aus und klicken Sie auf das Symbol Anwendungseigenschaften.
Um die Eigenschaftswerte zu ändern, klicken Sie auf das Symbol Bearbeiten oder tippen Sie darauf.
Konfigurieren Sie die Eigenschaften auf den Registerkarten "Einfach", "Erweitert", "Erstellen"und "Analytics"und klicken Sie dann auf das Symbol "Fertig".
Nachdem Sie die Mobilanwendung erstellt haben, fügen Sie Inhalte hinzu, die als Benutzeroberfläche der Anwendung verwendet werden.
Der Inhaltssynchronisierungscache in der AEM Veröffentlichungsinstanz wird als Repository für Inhalte für mobile Anwendungen verwendet:
Mobile Anwendungen enthalten einen Befehl "Updates", mit dem aktualisierte Anwendungsinhalte heruntergeladen und installiert werden. Wenn eine Anwendungsinstanz eine Aktualisierungsanforderung sendet, bestimmt die Inhaltssynchronisierung, welche Inhalte sich seit der letzten Aktualisierung oder Installation der Anwendung geändert haben, und stellt den neuen Inhalt bereit.
Um aktualisierte Inhalte für Anwendungen verfügbar zu machen, aktualisieren Sie den Content Sync-Cache. Wenn Sie den Cache zum ersten Mal aktualisieren, werden alle veröffentlichten Inhalte hinzugefügt. Bei nachfolgenden Aktualisierungen werden nur die veröffentlichten Inhalte hinzugefügt, die sich seit der letzten Aktualisierung geändert haben.
Bei der Inhaltssynchronisierung wird auch verfolgt, wann die Aktualisierungen stattfinden. Anhand dieser Informationen kann die Inhaltssynchronisierung bestimmen, welches Cache-Update an eine Mobilanwendung gesendet werden soll.
Führen Sie das folgende Verfahren für die Instanz durch, auf der Sie den Cache aktualisieren möchten. Wenn Ihre Anwendung beispielsweise Updates von der Veröffentlichungsinstanz anfordert, führen Sie das Verfahren für die Veröffentlichungsinstanz aus.
Klicken Sie in der Leiste auf oder tippen Sie auf Apps und dann auf Ihre Anwendung.
Wählen Sie die Begrüßungsseite aus und klicken Sie dann auf das Symbol "Cache aktualisieren"oder tippen Sie darauf.
Diese Funktion ist in Apps 6.1 Feature Pack 2 verfügbar und bietet eine einfache Möglichkeit, vorhandene App-Vorlagen für die Erstellung neuer Apps in AEM zu nutzen.
Was ist eine App-Vorlage? Stellen Sie sich dies als eine Sammlung von Seitenvorlagen und Komponenten vor, die eine Grundlage oder Grundlage einer App darstellen.
Wenn Sie eine neue App erstellen, die auf der Vorlage einer anderen App basiert, erhalten Sie eine App mit einem Startpunkt, der der App entspricht, aus der sie erstellt wurde.
Sie müssen über eine vorhandene mobile App-Vorlage verfügen (oder eine App mit einer App-Vorlage installiert haben), um diese Funktion nutzen zu können.
Das neueste AEM App 6.1-Musterpaket enthält eine aktualisierte Version der Geometrixx App mit einer App-Vorlage. Alternativ können Sie das StarterKit installieren, das auch eine Vorlage bereitstellt.
Schritte zum Erstellen einer neuen App basierend auf einer App-Vorlage:
Klicken Sie auf Weiter.
Geben Sie eine App-ID und einen Titel ein, Sie sollten jedoch auch einen Namen und eine Beschreibung angeben.
Wenn Sie das Referenz-App-Paket für Geometrixx Outdoors aus AEM deinstallieren und eine App basierend auf der Vorlage erstellen, funktioniert diese App nicht mehr. Die App "Geometrixx Outdoors"kann entfernt werden. Die App-Vorlage muss jedoch erhalten bleiben, wenn sie von anderen Mobilanwendungen verwendet wird.
Geometrixx Outdoors App ist eine Beispielanwendung für PhoneGap, die die Funktionen des standardmäßigen PhoneGap-Anwendungsblueprints und der mobilen Beispielkomponenten demonstriert.
Um die Anwendung zu öffnen, klicken Sie in der Leiste auf "Mobilanwendungen"und wählen Sie dann "Geometrixx Outdoors-App".
Jede Seite der mobilen App umfasst die folgenden Funktionen:
Eine Zurück-Schaltfläche zum Zurückkehren zur übergeordneten Seite. Beachten Sie, dass die Schaltfläche "Zurück"nicht auf der Startseite angezeigt wird.
Eine erweiterte Leiste, die ein Menü mit Befehlen und Links Angebot:
Das Absatzsystem zum Hinzufügen von Komponenten und Erstellen von Inhalten.
Der Inhalt der Startseite besteht aus den folgenden Navigationswerkzeugen:
Die Seite "Gear"bietet Benutzern Zugriff auf Produktseiten. Eine Komponente der Menu-Liste bietet Zugriff auf die untergeordneten Seiten der Zahnradseite. Die untergeordneten Seiten sind Kategorien von Produkten, die die Website enthält.
Jede Seite der Kategorie verwendet dieselbe Inhaltsstruktur wie die Seite "Gear". Das Karussell bietet Zugriff auf untergeordnete Seiten, die Unterkategorien von Produkten sind. Die Seiten der Unterkategorie enthalten Produktauflistungen, die Links zu Produktseiten enthalten.
Die Seite "Produkte"und ihre Hierarchie untergeordneter Seiten implementieren ein Klassifizierungssystem für Produktseiten. Die untersten Seiten in jeder Zweigstelle der Hierarchie sind Produktseiten, die eine ng-Produktkomponente enthalten.
Die Seite "Produkte"steht Anwendungsbenutzern nicht zur Verfügung. Die Zahnradseite bietet Zugriff auf jede Produktseite.
Enthält eine Zurück-Schaltfläche. Mit dem Absatzsystem können Sie Komponenten hinzufügen.
Bei Verwendung der Anwendung ist die Seite "Reviews"im Karussell auf der englischen Seite verfügbar.
Enthält eine Zurück-Schaltfläche. Mit dem Absatzsystem können Sie Komponenten hinzufügen.
Wenn Sie die Anwendung verwenden, ist die Seite Nachrichten im Karussell auf der englischen Seite verfügbar.
Die Seite "Über uns"enthält mehrere Komponenten für zwei Spalten. Jede Spalte enthält entweder eine Bild- oder eine Text-Komponente. Die Komponenten können bearbeitet werden, und das Absatzsystem ermöglicht es Ihnen, Komponenten hinzuzufügen.
Wenn Sie die Anwendung verwenden, ist die Info-Seite im Karussell auf der englischen Seite verfügbar.
Die Seite "Speicherorte"enthält eine Komponente "Speicherorte".
Wenn Sie die Anwendung verwenden, ist die Seite "Speicherorte"in der Menü-Liste auf der englischen Seite verfügbar.
Beim Authoring der Seiten einer mobilen Anwendung stehen in Sidekick sofort mehrere Komponenten zur Verfügung. Die Komponenten gehören zur Gruppe der PhoneGap-Komponenten.
Die Komponente "Karussell blättern"ist ein Werkzeug zum Anzeigen und Navigieren auf Seiten der Site. Die Komponente enthält ein Karussell, das die Bilder für die Seiten über einer Liste von Seitenlinks durchläuft. Bearbeiten Sie die Komponente, um die anzuzeigenden Seiten und das Verhalten des Karussells anzugeben.
Beachten Sie, dass Bilder im Karussell für Seiten angezeigt werden, die auf eine bestimmte Weise mit einem Bild verknüpft sind. Wenn Seiten nicht mit Bildern verknüpft sind, wird nur die Liste der Links angezeigt.
Karussell-Eigenschaften, Registerkarte
Verhalten des Karussels konfigurieren:
Registerkarte "Eigenschaften"
Geben Sie an, wie die Liste der Seite generiert wird:
Die Komponente "Karussell blättern"stellt die folgenden Werte für die Eigenschaft "Liste erstellen mit"bereit. Das Dialogfeld "Bearbeiten"ändert sich je nach ausgewähltem Wert:
Untergeordnete Seiten
Die Komponente Liste alle untergeordneten Seiten einer bestimmten Seite. Wählen Sie nach Auswahl dieses Wertes die Seite auf der Registerkarte "Untergeordnete Seiten"aus oder geben Sie keinen Wert für die Liste der untergeordneten Elemente der aktuellen Seite an.
Liste fester Werte
Geben Sie eine Liste der Einschlussseiten an. Nachdem Sie diesen Wert ausgewählt haben, konfigurieren Sie die Liste auf der Registerkarte "Feste Liste", die angezeigt wird, wenn Sie "Feste Liste"auswählen:
Die Eigenschaft "Reihenfolge nach"hat keine Auswirkungen auf die Reihenfolge der festen Listen.
Suchen
Füllen Sie die Liste mit den Ergebnissen einer Suchbegriffsuche. Die Suche wird in den untergeordneten Elementen einer Seite durchgeführt, die Sie angeben:
Erweiterte Suche
Füllen Sie die Liste mit einer Querybuilder-Abfrage.
hinzufügen Sie ein Bild in Ihren Anwendungsinhalt.
hinzufügen Rich-Text in Ihren Anwendungsinhalt.
Die Komponente "Speicherorte"bietet Benutzern Werkzeuge zum Suchen von Geschäftsfeldern:
Die Komponente erfordert, dass das Repository Informationen zum Speicherort für jeden Store enthält. Beispielspeicherorte werden unter dem Knoten /etc/commerce/locations/adobe installiert.
Ermöglicht das Hinzufügen von Komponenten nebeneinander zu einer Seite.