Modelli di pagina - Statici page-templates-static

Un modello viene utilizzato per creare una pagina e definisce quali componenti possono essere utilizzati all’interno dell’ambito selezionato. Un modello è una gerarchia di nodi con la stessa struttura della pagina da creare, ma senza alcun contenuto effettivo.

Ogni Modello presenta una selezione di componenti disponibili per l’uso.

  • I modelli sono costituiti da Componenti;
  • I componenti utilizzano i widget e ne consentono l’accesso; questi vengono utilizzati per eseguire il rendering del contenuto.
NOTE
Sono inoltre disponibili modelli modificabili, che rappresentano il tipo di modelli consigliato per la massima flessibilità e per le funzionalità più recenti.

Proprietà e nodi figlio di un modello properties-and-child-nodes-of-a-template

Un modello è un nodo di tipo cq:Template e presenta le seguenti proprietà e nodi figlio:

Nome
Tipo
Descrizione
.
cq:Template
Modello corrente. Un modello è di tipo nodo cq:Template.
allowedChildren
String[]
Percorso di un modello che può essere figlio di questo modello.
allowedParents
String[]
Percorso di un modello che può essere un elemento padre di questo modello.
allowedPaths
String[]
Percorso di una pagina che può essere basata su questo modello.
jcr:created
Data
Data di creazione del modello.
jcr:descrizione
Stringa
Descrizione del modello.
jcr:title
Stringa
Titolo del modello.
classificazione
Lungo
Classificazione del modello. Utilizzato per visualizzare il modello nell'interfaccia utente.
jcr:content
cq:PageContent
Nodo contenente il contenuto del modello.
thumbnail.png
nt:file
Miniatura del modello.
icon.png
nt:file
Icona del modello.

Un modello è la base di una pagina.

Per creare una pagina, è necessario copiare il modello (albero dei nodi /apps/<myapp>/template/<mytemplate>) nella posizione corrispondente nell'albero del sito: questo è ciò che accade se una pagina viene creata utilizzando la scheda Siti Web.

Questa azione di copia fornisce anche alla pagina il suo contenuto iniziale (in genere solo Contenuto di primo livello) e la proprietà sling:resourceType, il percorso del componente pagina utilizzato per il rendering della pagina (tutto ciò che si trova nel nodo figlio jcr:content).

Struttura dei modelli how-templates-are-structured

Vi sono due aspetti da considerare:

  • la struttura del modello stesso
  • la struttura del contenuto prodotto quando viene utilizzato un modello

Struttura di un modello the-structure-of-a-template

Un modello viene creato in un nodo di tipo cq:Template.

schermata_shot_2012-02-13alle63646pm

È possibile impostare varie proprietà, in particolare:

  • jcr:title - titolo del modello; viene visualizzato nella finestra di dialogo durante la creazione di una pagina.
  • jcr:description - descrizione del modello; viene visualizzato nella finestra di dialogo durante la creazione di una pagina.

Questo nodo contiene un nodo jcr:content (cq:PageContent) che viene utilizzato come base per il nodo del contenuto delle pagine risultanti; questo fa riferimento, utilizzando sling:resourceType, al componente da utilizzare per il rendering del contenuto effettivo di una nuova pagina.

schermata_shot_2012-02-13alle64010pm

Questo componente viene utilizzato per definire la struttura del contenuto quando viene creata una nuova pagina.

schermata_shot_2012-02-13alle64137pm

Contenuto prodotto da un modello the-content-produced-by-a-template

I modelli vengono utilizzati per creare pagine di tipo cq:Page (come indicato in precedenza, una pagina è un tipo speciale di componente). Ogni pagina AEM ha un nodo strutturato jcr:content. Tale comportamento:

  • è di tipo cq:PageContent
  • è un tipo di nodo strutturato contenente una definizione di contenuto definita
  • ha una proprietà sling:resourceType per fare riferimento al componente contenente gli script sling utilizzati per il rendering del contenuto

Modelli predefiniti default-templates

AEM viene fornito con vari modelli predefiniti disponibili. A volte può essere utile utilizzare i modelli così come sono. In tal caso, è necessario assicurarsi che il modello sia disponibile per il sito Web.

Ad esempio, l’AEM viene fornito con diversi modelli, tra cui una pagina di contenuto e una pagina Home.

Titolo
Component
Dove si trova
Scopo
Pagina home
homepage
geometrix
Il modello della home page del Geometrixx.
Pagina contenuto
contentpage
geometrix
Il modello della pagina di contenuto del Geometrixx.

Visualizzazione dei modelli predefiniti displaying-default-templates

Per visualizzare un elenco di tutti i modelli nel repository, procedere come segue:

  1. In CRXDE Lite aprire il menu Strumenti e fare clic su Query.

  2. Nella scheda Query

  3. Come Tipo, selezionare XPath.

  4. Nel campo di input Query immettere la stringa seguente:
    //element(*, cq:Template)

  5. Fare clic su Esegui. L'elenco viene visualizzato nella casella dei risultati.

Di solito, si prende un modello esistente e ne si sviluppa uno nuovo per il proprio uso. Per ulteriori informazioni, vedere Sviluppo di modelli di pagina.

Per abilitare un modello esistente per il sito Web e visualizzarlo nella finestra di dialogo Crea pagina durante la creazione di una pagina direttamente in Siti Web dalla console Siti Web, impostare la proprietà allowedPaths del nodo del modello su: /content(https://experienceleague.adobe.com/.&?lang=it#42;)?

Applicazione delle progettazioni dei modelli how-template-designs-are-applied

Quando gli stili vengono definiti nell'interfaccia utente tramite Modalità progettazione, la progettazione viene mantenuta nel percorso esatto del nodo di contenuto per il quale viene definito lo stile.

CAUTION
L'Adobe consiglia di applicare solo le progettazioni tramite Modalità progettazione.
La modifica dei progetti in CRXDE Lite, ad esempio, non è una best practice e l’applicazione di tali progetti può variare rispetto al comportamento previsto.

Se le progettazioni vengono applicate solo utilizzando la modalità Progettazione, le sezioni seguenti, Design Path Resolution, Decision Tree e Example non sono applicabili.

Risoluzione percorso progettazione design-path-resolution

Quando si esegue il rendering del contenuto basato su un modello statico, AEM tenta di applicare la progettazione e gli stili più rilevanti al contenuto in base a un attraversamento della gerarchia dei contenuti.

L’AEM determina lo stile più rilevante per un nodo di contenuto nel seguente ordine:

  • Se è presente una progettazione per il percorso completo ed esatto del nodo di contenuto (come quando la progettazione è definita in modalità Progettazione), utilizza tale progettazione.
  • Se è presente una progettazione per il nodo di contenuto dell’elemento padre, utilizza tale progettazione.
  • Se esiste una progettazione per qualsiasi nodo sul percorso del nodo di contenuto, utilizza tale progettazione.

Negli ultimi due casi, se è presente più di una progettazione applicabile, utilizza quella più vicina al nodo del contenuto.

Albero decisionale decision-tree

Rappresentazione grafica della logica Design Path Resolution.

risoluzione percorso_progettazione

Esempio example

Considera una semplice struttura di contenuto come segue, in cui una progettazione può essere applicata a uno qualsiasi dei nodi:

/root/branch/leaf

Nella tabella seguente viene descritto il modo in cui l'AEM sceglie una struttura.

Ricerca di un design per
I design esistono per
Progettazione scelta
Commenti
leaf

root

branch

leaf

leaf
La corrispondenza più esatta viene sempre accettata.
leaf

root

branch

branch
Tornare alla corrispondenza più vicina nella parte inferiore dell'albero.
leaf
root
root
Se tutti gli altri errori non riescono, prendere ciò che rimane.
branch
branch
branch
branch

branch

leaf

branch
branch

root

branch

branch
branch

root

leaf

root

Se non c'è una corrispondenza esatta, prenda quella più in basso nell'albero.

Si presume che questo sarà sempre applicabile, ma più in alto nella struttura può essere troppo specifico.

Sviluppo di modelli di pagina developing-page-templates

I modelli di pagina AEM sono semplicemente modelli utilizzati per creare pagine. Possono contenere il minimo o il massimo contenuto iniziale necessario, in quanto il loro ruolo è quello di creare le strutture di nodo iniziali corrette, con le proprietà richieste (principalmente sling:resourceType) impostate per consentire la modifica e il rendering.

Creazione di un modello (basato su un modello esistente) creating-a-new-template-based-on-an-existing-template

Un nuovo modello può essere creato completamente da zero, ma spesso viene copiato e aggiornato un modello esistente per risparmiare tempo e fatica. Ad esempio, puoi utilizzare i modelli all’interno di Geometrixx per iniziare.

Per creare un modello basato su un modello esistente:

  1. Copiare un modello esistente (preferibilmente con una definizione il più simile possibile a quella desiderata) in un nuovo nodo.

    I modelli sono archiviati in /apps/<nome-sito Web>/templates/<nome-modello>.

    note note
    NOTE
    L’elenco dei modelli disponibili dipende dalla posizione della nuova pagina e dalle restrizioni sul posizionamento specificate in ciascun modello. Vedi Disponibilità del modello.
  2. Modifica il jcr:title del nuovo nodo modello in modo che rifletta il nuovo ruolo. Se necessario, puoi anche aggiornare jcr:description. Assicurati di modificare la disponibilità del modello della pagina in modo appropriato.

    note note
    NOTE
    Se si desidera visualizzare il modello nella finestra di dialogo Crea pagina durante la creazione di una pagina direttamente in Siti Web dalla console Siti Web, impostare la proprietà allowedPaths del nodo del modello su: /content(/.*)?

    chlimage_1-88

  3. Copia il componente su cui si basa il modello (indicato dalla proprietà sling:resourceType del nodo jcr:content all'interno del modello) per creare un'istanza.

    I componenti sono archiviati in /apps/<nome-sito Web>/components/<nome-componente>.

  4. Aggiorna jcr:title e jcr:description del nuovo componente.

  5. Sostituire thumbnail.png se si desidera visualizzare una nuova miniatura nell'elenco di selezione del modello (dimensioni 128 x 98 px).

  6. Aggiorna sling:resourceType del nodo jcr:content del modello per fare riferimento al nuovo componente.

  7. Apportare ulteriori modifiche alla funzionalità o alla struttura del modello, del componente sottostante o di entrambi.

    note note
    NOTE
    Le modifiche apportate al nodo /apps/<sito Web>/templates/<nome-modello> hanno effetto sull'istanza del modello (come nell'elenco di selezione).
    Le modifiche apportate al nodo /apps/<sito Web>/components/<nome-componente> interessano la pagina del contenuto creata quando si utilizza il modello.

    Ora puoi creare una pagina all’interno del sito web utilizzando il nuovo modello.

NOTE
La libreria client dell'editor presuppone la presenza dello spazio dei nomi cq.shared nelle pagine di contenuto e, se è assente, l'errore JavaScript Uncaught TypeError: Cannot read property 'shared' of undefined restituisce i risultati.
Tutte le pagine di contenuto di esempio contengono cq.shared, pertanto qualsiasi contenuto basato su di esse include automaticamente cq.shared. Tuttavia, se decidi di creare pagine di contenuto personalizzate da zero senza basarle su contenuto di esempio, devi assicurarti di includere lo spazio dei nomi cq.shared.
Per ulteriori informazioni, vedere Utilizzo delle librerie lato client.

Come rendere disponibile un modello esistente making-an-existing-template-available

Questo esempio illustra come consentire l’utilizzo di un modello per determinati percorsi di contenuto. I modelli disponibili per l'autore della pagina durante la creazione delle pagine sono determinati dalla logica definita in Disponibilità modello.

  1. In CRXDE Lite, individua il modello da utilizzare per la pagina, ad esempio il modello Newsletter.

  2. Modificare la proprietà allowedPaths e altre proprietà utilizzate per disponibilità modello. Ad esempio, allowedPaths: /content/geometrixx-outdoors/[^/]+(/.*)? significa che questo modello è consentito in qualsiasi percorso in /content/geometrixx-outdoors.

    chlimage_1-89

recommendation-more-help
19ffd973-7af2-44d0-84b5-d547b0dffee2