Show Menu
ARGOMENTI×

Creazione e aggiunta di modelli e componenti

Adobe consiglia di utilizzare SPA Editor per i progetti che richiedono il rendering lato client basato sul framework dell'applicazione a pagina singola (ad es. React). Per saperne di più .
AEM Mobile On-Demand fornisce un modello di app completamente configurato, un modello di articolo e componenti articolo.
L'app We.Unlimited è un modello di esempio che rappresenta la shell di un'applicazione AEM Mobile On-Demand completamente configurabile e gestibile.
Selezionando questo modello di esempio durante la creazione di una nuova app, viene distribuito un dashboard ricco di funzioni di AEM Mobile.
Per gestire l'applicazione e il contenuto dell'app mobile dal Centro di controllo delle app AEM Mobile, consultate il Pannello applicazione AEM Mobile.

Creazione di modelli di app

Un modello app viene utilizzato per creare una nuova app e funge da raccolta di modelli di pagina e componenti che rappresentano una linea di base o una base di un'app. Il modello elimina alcune proprietà fondamentali per guidare l'app nel modo appropriato. In generale, un cliente non creerebbe troppe app in totale.
I modelli di app forniscono un modo semplice per sfruttare i progetti esistenti creati dagli sviluppatori, utilizzati per creare nuove app in AEM.
Quando crei una nuova app basata sul modello di un'altra app, riceverai un'app con un punto di partenza rappresentativo dell'app da cui è stata creata.
Passaggi per creare una nuova app basata su un modello di app:
  1. Andate al catalogo delle app AEM Mobile: <server-url>/aem/apps.html/content/mobileapps
  2. Seleziona Crea —> App come mostrato di seguito
Dopo aver creato un'app utilizzando questo modello, potete aggiungere articoli, banner e raccolte all'app. Per visitare nuovamente, creare articoli, banner e raccolte, consultate Azioni di gestione dei contenuti.
In alternativa, puoi anche selezionare un modello di app di esempio, ad esempio We.Unlimited app, che ti sarà reso disponibile da uno sviluppatore AEM. Se utilizzate questo modello di esempio per la vostra app, potete ottenere alcuni articoli di esempio e raccolte su cui lavorare. Potete utilizzare i modelli e i componenti di esempio, personalizzare quelli esistenti o crearne di nuovi per l'app.
Impostazione della proprietà redirectTarget
Quando si utilizza uno dei modelli di app, lo sviluppatore definisce il contenuto dell'applicazione. Tuttavia, lo sviluppatore deve sapere dove viene creata l'applicazione nel jcr e il valore della proprietà redirectTarget .
Il redirectTarget viene calcolato come parte dell'operazione di creazione dell'app e tenta di risolvere un percorso, se esiste una proprietà redirectTarget disponibile come parte del modello di app e il valore di redirectTarget è definito come relativo. Quando il processo di creazione dell'app trova un valore relativo per redirectTarget nel modello di app, il valore viene aggiunto alla posizione risolta in cui è stata creata l'app.
Ad esempio, se un modello di app definisce un redirectTarget con un valore " language-masters/en " e l'app è stata creata in " /content/mobileapps/fooApp ", il valore finale per redirectTarget dopo la creazione dell'app sarà " /content/mobileapps/fooApp/language-masters/en ".

Creazione di modelli di contenuto

Ogni tipo di entità ha due modelli predefiniti. Si tratta di:
  • Modelli predefiniti: utilizzato per la creazione di contenuto con proprietà/struttura predefinite applicabili
  • Modelli importati: utilizzato per importare contenuto da AEM Mobile con proprietà/struttura predefinite applicabili

Modelli articolo

L'articolo Unlimited è un modello di esempio che rappresenta un tipico layout di articolo AEM Mobile On-Demand.
  1. Fate clic su + in Gestisci articoli per creare un nuovo articolo. Potete scegliere un articolo illimitato o RTF . L'immagine seguente mostra l'opzione che consente di scegliere tra questi due modelli di articolo.
  2. Fate clic su Avanti per definire i metadati dell'articolo come Nome/Titolo articolo, Descrizione, Autore, Abstract, Dipartimento, Immagine miniatura, Accesso articolo e così via.
  3. Fate clic su Avanti per compilare il campo Proprietà annuncio.
  4. Fate clic su Avanti per inserire l'immagine dell'articolo o l'immagine del social media
  5. Fate clic su Avanti per scegliere un collegamento alla raccolta a cui collegare il nuovo articolo.
  6. Fate clic su Avanti per immettere i dettagli per la condivisione per social network.
  7. Fate clic su Crea per completare il processo di creazione di un articolo utilizzando l'esempio. Fate clic su Fine o Modifica articolo per modificare le proprietà di questo articolo.

Aggiunta di componenti a un articolo

Una volta creato, un autore può modificare il contenuto di un articolo aggiungendo componenti come testo e immagini. Gli articoli sono un'estensione dei modelli di pagina AEM.
Selezionate un articolo, che desiderate modificare e fate clic su Modifica per aggiungere componenti all’articolo.
Scegliete ' + ' nel pannello a sinistra per aggiungere componenti all'articolo.

Creazione di modelli predefiniti

Non sono disponibili modelli di articolo predefiniti, ma esiste un modello predefinito che i modelli personalizzati devono estendere. Consultate Esempio di modello per articolo dell’app Geometrixx Unlimited.
Le proprietà chiave oltre le normali proprietà richieste per i modelli AEM includono:
dps-resourceType="dps:Article"
Questa proprietà assicura che la pagina AEM venga riconosciuta come pagina di articolo di destinazione di AEM Mobile.
In base ai modelli AEM, potete aggiungere proprietà o nodi figlio predefiniti al jcr:content del modello.

Creazione e aggiunta di componenti

I componenti utilizzano e consentono l'accesso ai Widget e questi vengono utilizzati per il rendering del contenuto.
Un semplice componente è incluso nell’archivio dei codici, la cui origine si trova in AEM. Successivamente, può essere aperto localmente anche in CRXDE Lite.
Al momento non sono disponibili componenti forniti per AEM Mobile.
Puoi aggiungere componenti alla pagina. Qualsiasi componente può essere utilizzato in un'app AEM Mobile, ma se applicato, potrebbe non essere eseguito correttamente il rendering.
Tuttavia, i componenti personalizzati potrebbero non essere esportati e caricati correttamente in AEM Mobile On-Demand Services senza un gestore di sincronizzazione dei contenuti per l'esportazione personalizzato che esegue il rendering in AEM.
Una volta che il componente è già stato incluso in una pagina AEM, insieme ad altri componenti per blocchi costitutivi, potete aggiungere un altro componente alla pagina o modificarne uno esistente.
Per aggiungere un altro componente alla pagina:
  1. Scegliete la pagina desiderata e accertatevi di essere in modalità Modifica, mediante il menu a discesa in alto a destra dell’intestazione dell’editor
  2. Attiva/disattiva il pannello laterale utilizzando l’icona più a sinistra nell’intestazione dell’editor
  3. Select the Components tab
  4. Trascinare uno dei componenti disponibili sulla pagina
Per modificare un componente esistente:
  1. Scegli la pagina desiderata e accertati di essere in modalità Modifica e seleziona il componente
  2. Toccate l’icona della chiave inglese per configurare il componente
Potete creare un componente in AEM e personalizzarlo utilizzando Sviluppo con CRXDE Lite . Dopo aver personalizzato il componente esistente come requisiti, potete aggiungerlo nella pagina utilizzando l’opzione Modifica in Gestisci articoli come illustrato nella figura precedente.
Fate riferimento alle best practice per lo sviluppo di modelli e componenti in AEM Mobile.