Visar anpassade tillgångstyper i AEM Forms listing-custom-asset-types-in-aem-forms
Skapa anpassad mall creating-custom-template
I den här artikeln skapar vi en anpassad mall som visar de anpassade resurstyperna och OOTB-resurstyperna på samma sida. Följ nedanstående instruktioner för att skapa en anpassad mall
- Skapa en sling:-mapp under /apps. Ge den namnet "myportalcomponent"
- Lägg till egenskapen fpContentType. Ange värdet /libs/fd/ fp/formTemplate.
- Lägg till en title-egenskap och ställ in dess värde på "custom template". Det här namnet visas i listrutan för sök- och listkomponenten
- Skapa en"template.html" under den här mappen. Den här filen innehåller koden för att formatera och visa de olika resurstyperna.
I följande kod visas de olika typerna av resurser som använder söknings- och listkomponenten. Vi skapar separata html-element för varje typ av resurs, vilket visas med taggen data-type = "videos". För resurstypen "videor" använder vi elementet <video> för att spela upp den infogade videon. För resurstypen "worddocuments" använder vi olika html-markeringar.
<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>
Konfigurera sök- och listkomponenten configure-search-and-lister-component
När vi har definierat den anpassade mallen måste vi nu koppla den anpassade mallen till komponenten Sök och visa. Peka webbläsaren mot den här URL:en.
Växla till designläge och konfigurera styckesystemet så att det inkluderar Search and Lister-komponenten i den tillåtna komponentgruppen. Komponenten Sök och Lister ingår i Document Services-gruppen.
Växla till redigeringsläget och lägg till komponenten Sök och Lister i ParSys.
Öppna konfigurationsegenskaperna för komponenten Sök och visa. Kontrollera att fliken "Resursmappar" är markerad. Välj de mappar från vilka du vill visa resurserna i sök- och listkomponenten. I den här artikeln har jag valt
- /content/dam/VideosAndWordDocuments
- /content/dam/formsanddocuments/assettypes
Fliken till fliken "Visa". Här väljer du den mall som du vill visa resurserna i sök- och listkomponenten.
Välj "anpassad mall" i listrutan enligt nedan.
Konfigurera de typer av resurser som du vill visa i portalen. Om du vill konfigurera resurstypernas flik till"Resurslista" och konfigurera resurstyperna. I det här exemplet har vi konfigurerat följande typer av resurser
- MP4-filer
- Orddokument
- Dokument (OOTB-tillgångstyp)
- Formulärmall (OOTB-resurstyp)
I följande skärmbild visas resurstyperna som är konfigurerade för listning
Nu när du har konfigurerat söknings- och listportalkomponenten är det dags att se hur listan fungerar. Peka webbläsaren mot den här URL:en. Resultatet ska se ut ungefär som bilden nedan.
Hämta och installera det här paketet med pakethanteraren. Detta innehåller exempel på mp4- och orddokument samt xdp-filer som används som resurstyper för att lista med hjälp av sök- och listkomponenten