Elenco dei tipi di risorse personalizzate in AEM Forms

Creazione di un modello personalizzato

Ai fini di questo articolo, creeremo un modello personalizzato per visualizzare i tipi di risorse personalizzate e i tipi di risorse OOTB sulla stessa pagina. Per creare un modello personalizzato segui le seguenti istruzioni

  1. Crea un sling: sotto /apps. Denomina " myportalcomponent "
  2. Aggiungi una proprietà "fpContentType". Imposta il suo valore su "/libs/fd/ fp/formTemplate".
  3. Aggiungi una proprietà "title" e imposta il suo valore su "modello personalizzato". Nome visualizzato nell’elenco a discesa del componente Ricerca e filtro
  4. Crea un "template.html" sotto questa cartella. Questo file contiene il codice per personalizzare lo stile e visualizzare i vari tipi di risorse.

appsfolder

Il codice seguente elenca i 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 l’elemento <video> per riprodurre il video in linea. Per il tipo di risorsa "documenti di parole" utilizziamo contrassegni HTML diversi.

<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>
NOTA

Linea 11 - Cambiare l'immagine src per puntare a un'immagine scelta in DAM.

Per elencare Adaptive Forms in questo modello, crea un nuovo div e imposta il suo attributo data-type su "guide". È possibile copiare e incollare il div di cui data-type="printForm e impostare il tipo di dati del div appena copiato su "guide"

Configura componente Ricerca E Registrazione

Una volta definito il modello personalizzato, dobbiamo ora associare questo modello personalizzato al componente "Ricerca e filtro". Puntare il browser a questo URL .

Passa alla modalità Progettazione e configura il sistema paragrafo in modo da includere il componente Ricerca e tiene traccia nel gruppo di componenti consentiti. Il componente Ricerca e Registrazione fa parte del gruppo Document Services .

Passa alla modalità di modifica e aggiungi il componente Ricerca e filtro a ParSys.

Apri le proprietà di configurazione del componente "Search and Lister". Assicurati che la scheda "Cartelle risorse" sia selezionata. Seleziona le cartelle da cui vuoi elencare le risorse nel componente Ricerca e ascoltatore . Ai fini del presente articolo, ho selezionato

  • /content/dam/VideosAndWordDocuments
  • /content/dam/formsanddocuments/assettypes

assetfolder

Passa alla scheda "Visualizzazione". Qui puoi scegliere il modello per visualizzare le risorse nel componente Ricerca e Ascolto .

Seleziona "modello personalizzato" dal menu a discesa, come mostrato di seguito.

ricercatrice

Configura i tipi di risorse da elencare nel portale. Per configurare i tipi di scheda della risorsa in "Elenco risorse" e i tipi di risorse, effettua le seguenti operazioni: In questo esempio è possibile configurare i seguenti tipi di risorse

  1. File MP4
  2. Documenti Word
  3. Document(Questo è il tipo di risorsa OOTB)
  4. Modello di modulo (tipo di risorsa OOTB)

La schermata seguente mostra i tipi di risorse configurati per l’elenco

assettypes

Ora che hai configurato il componente Search and Lister Portal, è il momento di vedere il listener in azione. Puntare il browser a questo URL . I risultati dovrebbero essere simili all'immagine mostrata di seguito.

NOTA

Se il portale sta elencando tipi di risorse personalizzate su un server di pubblicazione, assicurati di concedere l'autorizzazione "read" all'utente "fd-service" sul nodo /apps/fd/fp/extensions/querybuilder


assettypesScarica e installa questo pacchetto utilizzando il gestore dei pacchetti. Questo contiene documenti mp4 e Word di esempio e file xdp che verranno utilizzati come tipi di risorse da elencare utilizzando il componente di ricerca e ascolto

In questa pagina