Elencare tipi di risorse personalizzati in AEM Forms listing-custom-asset-types-in-aem-forms
Creazione di un modello personalizzato creating-custom-template
Ai fini di questo articolo, stiamo creando un modello personalizzato per visualizzare i tipi di risorse personalizzati e i tipi di risorse OOTB sulla stessa pagina. Per creare un modello personalizzato, segui le seguenti istruzioni
- Crea una cartella sling: in /apps. Denomina il componente myportalcomponent
- Aggiungi una proprietà "fpContentType". Imposta il suo valore su "/libs/fd/ fp/formTemplate".
- Aggiungi una proprietà "title" e impostane il valore su "custom template". Questo è il nome che verrà visualizzato nell’elenco a discesa del componente Ricerca ed elenco
- Crea un "template.html" in questa cartella. Questo file contiene il codice per applicare uno stile e visualizzare i vari tipi di risorse.
Di seguito è riportato un elenco dei vari tipi di risorse che utilizzano il componente Ricerca e lister. Creiamo elementi HTML separati per ogni tipo di risorsa, come mostrato dal tag data-type = "videos". Per il tipo di risorsa "video" utilizziamo <video> per riprodurre il video in linea. Per il tipo di risorsa "worddocuments" usiamo un markup HTML diverso.
<div class="__FP_boxes-container __FP_single-color">
<div data-repeatable="true">
<div class = "__FP_boxes-thumbnail" style="float:left;margin-right:20px;" data-type = "videos">
<video width="400" controls>
<source src="${path}" type="video/mp4">
</video>
<h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
</div>
<div class="__FP_boxes-thumbnail" style="float:left;margin-right:20px;" data-type = "worddocuments">
<a href="/assetdetails.html${path}" target="_blank">
<img src ="/content/dam/worddocuments/worddocument.png/jcr:content/renditions/cq5dam.thumbnail.319.319.png"/>
</a>
<h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
</div>
<div class="__FP_boxes-thumbnail" style="float:left;margin-right:20px;" data-type = "xfaForm">
<a href="/assetdetails.html${path}" target="_blank">
<img src ="${path}/jcr:content/renditions/cq5dam.thumbnail.319.319.png"/>
</a>
<h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
<a href="{formUrl}"><img src="/content/dam/html5.png"></a><p>
</div>
<div class="__FP_boxes-thumbnail" style="float:left;margin-right:20px;" data-type = "printForm">
<a href="/assetdetails.html${path}" target="_blank">
<img src ="${path}/jcr:content/renditions/cq5dam.thumbnail.319.319.png"/>
</a>
<h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
<a href="{pdfUrl}"><img src="/content/dam/pdf.png"></a><p>
</div>
</div>
</div>
Configurare Il Componente Ricerca Ed Elenco configure-search-and-lister-component
Dopo aver definito il modello personalizzato, è necessario associarlo al componente "Ricerca ed elenco". Puntare il browser a questo url.
Passa alla modalità Progettazione e configura il sistema paragrafo in modo da includere il componente Ricerca ed elenco nel gruppo di componenti consentiti. Il componente Ricerca ed elenco fa parte del gruppo Servizi basati su documenti.
Passa alla modalità di modifica e aggiungi il componente Ricerca ed Elenco ai ParSys.
Apri le proprietà di configurazione del componente "Ricerca ed elenco". Assicurati che la scheda "Cartelle risorse" sia selezionata. Seleziona le cartelle da cui desideri elencare le risorse nel componente Ricerca e lister. Ai fini del presente articolo, ho selezionato
- /content/dam/VideosAndWordDocuments
- /content/dam/formsanddocuments/assettypes
Passa alla scheda "Visualizzazione". Qui puoi scegliere il modello in cui visualizzare le risorse nel componente Ricerca e lister.
Seleziona "modello personalizzato" dal menu a discesa, come illustrato di seguito.
Configura i tipi di risorse da elencare nel portale. Per configurare i tipi di scheda delle risorse in "Elenco risorse" e i tipi di risorse. In questo esempio abbiamo configurato i seguenti tipi di risorse
- File MP4
- Documenti di Word
- Documento (tipo di risorsa OOTB)
- Modello modulo (tipo di risorsa OOTB)
La schermata seguente mostra i tipi di risorse configurati per l’inserzione
Dopo aver configurato il componente Portale di ricerca ed elenco, è ora di visualizzare il lister in azione. Puntare il browser a questo url. I risultati dovrebbero essere simili all’immagine mostrata di seguito.
Scarica e installa questo pacchetto utilizzando Gestione pacchetti. Contiene documenti mp4 e word di esempio e file xdp utilizzati come tipi di risorse da elencare utilizzando il componente Ricerca e lister