Personalizzazione dei modelli per i componenti di Forms Portal customizing-templates-for-forms-portal-components

Prerequisiti prerequisites

Gestione dei metadati del modulo

Conoscenza pratica di HTML e CSS

Panoramica overview

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.

Creazione di un modello personalizzato creating-a-nbsp-custom-template

Esempio di lavoro working-example

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>

Specifiche tecniche per i modelli personalizzati technical-specifications-for-custom-templates

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/preconfigurati. 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 ripetibili ​l'attributo presente nell'elemento Div ha il valore true.

Ogni segnaposto dispone di un set di metadati predefinito 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 percorso ​nel modo prescritto.

Metadati pronti all’uso out-of-the-box-metadata

Diversi componenti di Forms Portal forniscono set esclusivi di metadati predefiniti che è possibile utilizzare per l’elenco.

Componente Ricerca ed elenco search-amp-lister-component

Supporto per la localizzazione, l'ordinamento e l'utilizzo delle proprietà di configurazione nell'interfaccia utente (solo Search&List):

Componente collegamento link-component

Componente Bozze e invii drafts-amp-submissions-component

Nota:

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"

Suggerimenti, trucchi e problemi noti tips-tricks-and-known-issues

Articoli correlati