Creazione e aggiunta di modelli e componenti creating-and-adding-templates-and-components

CAUTION
AEM 6.4 ha raggiunto la fine del supporto esteso e questa documentazione non viene più aggiornata. Per maggiori dettagli, consulta la nostra periodi di assistenza tecnica. Trova le versioni supportate qui.
NOTE
Adobe consiglia di utilizzare l’editor di SPA per i progetti che richiedono il rendering lato client basato sul framework di un’applicazione a pagina singola (ad esempio, React). Ulteriori informazioni.

AEM Mobile On-Demand fornisce un modello di app completamente configurato, un modello di articolo e componenti di articoli.

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.

chlimage_1-70

NOTE
Per gestire l’applicazione e il contenuto dell’app mobile da AEM Mobile Apps Control Center, consulta la sezione Dashboard dell'applicazione AEM Mobile.

Creazione di modelli di app creating-app-templates

Un modello di 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 base di un’app. Il modello estrae alcune proprietà fondamentali per guidare l’app nel modo appropriato. In generale, un cliente non creerebbe troppe app in totale.

I modelli di app consentono di sfruttare facilmente i progetti esistenti creati dagli sviluppatori, utilizzati per la creazione di nuove app all’interno di 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. Passa al catalogo delle app AEM Mobile: <server-url>/aem/apps.html/content/mobileapps
  2. Seleziona Crea —> App come mostrato di seguito

Una volta creata un'app utilizzando questo modello, puoi aggiungere articoli, banner e raccolte all'app. Per visitare di nuovo, creare articoli, banner e raccolte, vedi Azioni di gestione dei contenuti.

NOTE
In alternativa, puoi anche selezionare un modello di app di esempio, ad esempio We.Unlimited app, resa disponibile da uno sviluppatore AEM. Se utilizzi questo modello di esempio per la tua app, puoi ottenere alcuni articoli e raccolte di esempio su cui lavorare. Sarà possibile utilizzare i modelli e i componenti di esempio, personalizzare quelli esistenti o crearne di nuovi per l’app.
CAUTION
Impostazione redirectTarget property
Quando utilizzi uno dei modelli di app, lo sviluppatore definisce il contenuto dell’applicazione. Tuttavia, lo sviluppatore deve sapere dove viene creata l’applicazione in jcr e il valore di redirectTarget proprietà.
La redirectTarget viene calcolato come parte dell'operazione di creazione dell'app e tenta di risolvere un percorso, se è disponibile una proprietà redirectTarget 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 il valore "lingua-maestri/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/it".

Creazione di modelli di contenuto creating-content-templates

Ogni tipo di entità dispone di due modelli predefiniti. Secondo questi principi, il contenuto deve essere:

  • Modelli predefiniti: utilizzato per la creazione di contenuti con proprietà/struttura predefinite applicabili
  • Modelli importati: utilizzato per importare contenuti da AEM Mobile con proprietà/struttura predefinite applicabili

Modelli di articolo article-templates

L’articolo illimitato è un modello di esempio che rappresenta un tipico layout di articolo AEM Mobile On-Demand.

  1. Fai clic su + in Gestire gli articoli per creare un nuovo articolo. Puoi scegliere una delle due opzioni Articolo illimitato o Articolo RTF. L’immagine seguente mostra l’opzione che consente di scegliere tra uno qualsiasi di questi due modelli di articolo.

  2. Fai clic su Successivo definire metadati dell'articolo, ad esempio Nome/Titolo articolo, Descrizione, Autore, Abstract, Reparto, Immagine miniatura, Accesso articolo e così via.

  3. Fai clic su Successivo per compilare le Proprietà annuncio.

  4. Fai clic su Successivo per accedere all'immagine dell'articolo o all'immagine social media

  5. Fai clic su Successivo per scegliere un collegamento di raccolta a questo nuovo articolo.

  6. Fai clic su Successivo per inserire i dettagli della condivisione social network.

  7. Fai clic su Crea per completare il processo di creazione di un articolo utilizzando l’esempio. Fai clic su Fine o Modifica articolo per modificare le proprietà di questo articolo.

chlimage_1-71

Aggiunta di componenti all’articolo adding-components-to-article

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.

Seleziona un articolo da modificare e fai clic su Modifica per aggiungere componenti all’articolo.

chlimage_1-72 chlimage_1-73

Scegli il + nel pannello a sinistra per aggiungere componenti all’articolo.

chlimage_1-74

Creazione di modelli predefiniti creating-out-of-the-box-templates

Non sono disponibili modelli di articolo predefiniti, tuttavia è disponibile un modello predefinito che i modelli personalizzati devono estendere, consulta l’ Esempio di modello di articolo.

Le proprietà chiave oltre le normali proprietà richieste AEM modello includono:

dps-resourceType="dps:Article"

Questa proprietà assicura che la pagina AEM venga riconosciuta come pagina dell'articolo mirata di AEM Mobile.

In base ai modelli AEM, è possibile aggiungere proprietà o nodi figlio predefiniti ai modelli jcr:content.

Modelli di banner e raccolta banner-and-collection-templates

CAUTION
I banner e le raccolte non dispongono di contenuto, pertanto la loro creazione non supporta modelli personalizzati.

Creazione e aggiunta di componenti creating-and-adding-components

I componenti utilizzano e consentono l’accesso ai Widget e vengono utilizzati per eseguire il rendering del contenuto.

Un componente semplice è incluso nell’archivio del codice, la cui origine si trova in AEM. Successivamente, può essere aperto anche localmente in CRXDE Lite.

NOTE
Al momento non sono disponibili componenti predefiniti 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 esportare e caricare correttamente in AEM Mobile On-demand Services senza un gestore di sincronizzazione dei contenuti di esportazione personalizzato che esegua il rendering in AEM.

Una volta che il componente è già stato incluso in una pagina AEM, insieme ad altri componenti per blocchi predefiniti, puoi aggiungere un altro componente alla pagina o modificarne uno esistente.

Per aggiungere un altro componente alla pagina:

  1. Scegli quella pagina e accertati di essere in modalità Modifica tramite il menu a discesa in alto a destra dell’intestazione dell’editor
  2. Attiva o disattiva il pannello laterale utilizzando l’icona più a sinistra nell’intestazione dell’editor
  3. Seleziona la Componenti scheda
  4. Trascina uno dei componenti disponibili nella pagina

chlimage_1-75

Per modificare un componente esistente:

  1. Scegli quella pagina e assicurati di essere in Modifica e seleziona il componente
  2. Tocca l’icona a forma di chiave inglese per configurare il componente
NOTE
Puoi creare un componente in AEM e personalizzarlo utilizzando Sviluppo con CRXDE Lite. Dopo aver personalizzato il componente esistente come necessario, puoi aggiungerlo nella pagina utilizzando Modifica opzione sotto Gestire gli articoli come mostrato nella figura precedente.
NOTE
Fai riferimento a Best practice per lo sviluppo di modelli e componenti in AEM Mobile.

Passaggi successivi the-next-steps

recommendation-more-help
547b817b-14b5-4d82-aa0f-a64750e0e592