Gestione dei metadati del modulo
Conoscenza pratica di HTML e CSS
L’interfaccia utente di AEM Forms consente di aggiungere metadati a qualsiasi modulo. I metadati personalizzati possono migliorare l’esperienza utente nell’elencare e cercare i moduli dell’organizzazione.
Forms Portal consente di utilizzare metadati personalizzati negli elenchi dei moduli. Durante la creazione di modelli personalizzati per le risorse, puoi modificarne il layout e utilizzare metadati personalizzati con il set di stili CSS.
Effettua le seguenti operazioni per creare un modello personalizzato per vari componenti di Forms Portal.
Creare un nodo sling:Folder in /apps
Aggiungi una proprietà "fpContentType". Specifica i valori appropriati per la proprietà a seconda del componente per il quale stai definendo il modello personalizzato.
Componente Ricerca ed elenco: "/libs/fd/fp/formTemplate"
Componente Bozze e invii:
Componente collegamento: /libs/fd/fp/linkTemplate
Aggiungi un titolo da visualizzare durante la selezione dei modelli di layout.
Il titolo può essere diverso dal nome del nodo sling:Folder creato.
L’immagine seguente illustra la configurazione del componente Ricerca ed elenco.
Crea un file template.html in questa cartella affinché possa fungere da modello personalizzato.
Scrivi il modello personalizzato e utilizza i metadati personalizzati come descritto di seguito.
Di seguito è riportato un esempio di implementazione di un modello personalizzato in cui Forms Portal acquisisce un layout personalizzato per la scheda Geometrixx per il componente Ricerca ed elenco.
<div class="__FP_boxes-container __FP_single-color">
<div class="boxes __FP_boxes __FP_single-color" data-repeatable="true">
<div class="__FP_boxes-thumbnail">
<img src ="${path}/jcr:content/renditions/cq5dam.thumbnail.319.319.png"/>
</div>
<h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
<p>${description}</p>
<div class="boxes-icon-cont __FP_boxes-icon-cont">
<div class="op-dow">
<a href="${formUrl}" target="_blank" class="__FP_button ${htmlStyle}" title="${config-htmlLinkText}">${localize-Apply}</a>
<a href="${pdfUrl}" class="__FP_button ${pdfStyle}" title="${config-pdfLinkText}">${localize-Download}</a>
</div>
</div>
</div>
</div>
Un modello personalizzato per qualsiasi componente di Forms Portal include voci ripetibili e non ripetibili. Le voci ripetibili sono entità di base per l'inserimento nell'elenco. Esempi di voci ripetibili sono Search & Lister (Ricerca e elenco), Bozze e invii e Componenti link.
Forms Portal fornisce una sintassi per i segnaposto per visualizzare metadati personalizzati/OOTB. I segnaposto vengono compilati dopo la visualizzazione dei risultati di maschere, bozze o invii.
Per includere una voce ripetibile, configura il valore dell'attributo dati ripetibili a true.
Nell’esempio discusso, due elementi Div sono presenti nella parte superiore del modello personalizzato. La prima, con classe CSS "__FP_boxes-container", funziona come elemento contenitore per i moduli elencati. La seconda, con la classe CSS "__FP_boxes", è un modello per le entità di base, in questo caso un modulo. Il dati ripetibilil'attributo presente nell'elemento Div ha il valore true.
Ogni segnaposto dispone di un set di metadati OOTB esclusivo. Per visualizzare i metadati personalizzati in una posizione specifica del modulo, aggiungere ${metadata_prop} proprietà sul posto.
Nell’esempio, la proprietà dei metadati viene utilizzata in più istanze. Ad esempio, viene utilizzato in descrizione,nome,formUrl,htmlStyle,pdfUrl,pdfStyle, e percorsonel modo prescritto.
Diversi componenti di Forms Portal forniscono set esclusivi di metadati OOTB che è possibile utilizzare per l’elenco.
Titolo: Titolo del modulo
nome: nome del modulo (per lo più lo stesso del titolo)
descrizione: descrizione del modulo
formUrl: URL per riprodurre il modulo come HTML
pdfUrl: URL per riprodurre il modulo come PDF
assetType: tipo di risorsa. I valori validi includono Modulo, Modulo PDF, Stampa modulo, e Modulo adattivo
htmlStyle E pdfStyle: stile di visualizzazione rispettivamente delle icone HTML e PDF utilizzate per il rendering. I valori validi sono "__FP_display_none" o vuoto.
Ricordarsi di utilizzare la classe __FP_display_none nel foglio di stile personalizzato.
Supporto per la localizzazione, l'ordinamento e l'utilizzo delle proprietà di configurazione nell'interfaccia utente (solo Search&List):
Supporto per la localizzazione: per localizzare qualsiasi testo statico, utilizza l’attributo ${localize-YOUR_TEXT}
e rende disponibile il valore localizzato, se non esiste già.
Nell’esempio discusso, gli attributi ${localize-Apply}
e ${localize-Download}
vengono utilizzati per localizzare il testo Applica e Scarica.
Supporto per l’ordinamento: fai clic sull’elemento HTML per ordinare i risultati della ricerca. Per implementare l’ordinamento in un layout di tabella, aggiungi l’attributo "data-sortKey" nell’intestazione della tabella specifica. Inoltre, aggiungi il relativo valore come metadati per i quali desideri ordinare.
Ad esempio, per l’intestazione "Title" (Titolo) nella visualizzazione a griglia, il valore dell’intestazione "data-sortKey" è "title". Fai clic sull’intestazione per ordinare i valori in una particolare colonna.
Utilizzo delle proprietà di configurazione: il componente Ricerca ed elenco dispone di diverse configurazioni che è possibile utilizzare nell’interfaccia utente. Ad esempio, per visualizzare il testo della descrizione HTML salvato nella finestra di dialogo per modifica, utilizzare ${config-htmlLinkText}
attributo. Analogamente, per il testo della descrizione comandi di PDF, utilizzate ${config-pdfLinkText}
attributo.
Nota:
Per l’opzione Elimina nella sezione Bozze del componente Bozze e invii, assegna alla classe CSS il nome "__FP_deleteDraft". Inoltre, includi l’attributo "draftID" con il valore ${draftID}, che è l’ID bozza della bozza corrispondente.
Durante la creazione di collegamenti per aprire bozze e invii, è possibile specificare ${path}.html come valore del href per il tag di ancoraggio.
A. Elemento contenitore
B. Metadati "path" con una gerarchia fissa per ottenere la miniatura memorizzata per ciascun modulo.
C. Attributo dati ripetibili utilizzato per la sezione del modello per ciascun modulo
D. Localizzare la stringa "Apply"
E. Utilizzo della proprietà di configurazione pdfLinkText
F. Utilizzo dei metadati "pdfUrl"