Anpassa mallar för komponenter i formulärportalen customizing-templates-for-forms-portal-components

CAUTION
AEM 6.4 har nått slutet på den utökade supporten och denna dokumentation är inte längre uppdaterad. Mer information finns i teknisk supportperiod. Hitta de versioner som stöds här.

Förutsättningar prerequisites

Hantera formulärmetadata

Arbetskunskaper i HTML och CSS

Översikt overview

Med AEM Forms användargränssnitt kan du lägga till metadata i alla formulär. Anpassade metadata kan förbättra användarupplevelsen samtidigt som du listar och söker efter formulär i organisationen.

Med Forms Portal kan du använda anpassade metadata i formulärlistor. När du skapar anpassade mallar för resurser kan du ändra deras layout och använda anpassade metadata med din CSS-formatuppsättning.

Följ de här stegen för att skapa en anpassad mall för olika Forms Portal-komponenter.

Skapa en anpassad mall creating-a-nbsp-custom-template

  1. Skapa en sling:Mappnod under */apps *

    Lägg till en fpContentType-egenskap. Ange lämpliga värden för egenskapen beroende på vilken komponent du definierar den anpassade mallen för.

    • Komponenten Search & Lister: "/libs/fd/fp/formTemplate"

    • Komponenten Utkast och inskickat material:

      • Avsnittet Utkast: /libs/fd/fp/draftTemplate
      • Inlämningsavsnitt: /libs/fd/fp/sendingTemplate
    • Länkkomponent: /libs/fd/fp/linkTemplate

    Lägg till en titel som du vill ska visas när du väljer layoutmallar.

    *Obs! Titeln kan skilja sig från nodnamnet för sling:Mapp som du skapade. *
    I följande bild visas konfigurationen för komponenten Sök och Lister. Skapa en slinga:Mapp

  2. Skapa en filmall.html i den här mappen som ska fungera som anpassad mall.

  3. Skriv den anpassade mallen och använd anpassade metadata enligt beskrivningen nedan.

Exempel working-example

Nedan följer ett exempel på implementering av en anpassad mall där Forms Portal förvärvar en anpassad Geometrixx-Gov-kortlayout för komponenten Sök och visa.

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

Tekniska specifikationer för anpassade mallar technical-specifications-for-custom-templates

En anpassad mall för valfri Forms Portal-komponent innehåller repeterbara och icke-repeterbara poster. Repeterbara poster är grundläggande enheter som ska tas upp i förteckningen. Exempel på upprepningsbara poster är komponenterna Sök och Lister, Utkast och överföringar samt Länka.

Forms Portal innehåller en syntax där platshållare kan visa anpassade metadata/OTB-metadata. Platshållarna fylls i när resultatet av formulär, utkast eller inskickade formulär visas.

Om du vill ta med en repeterbar post konfigurerar du värdet för attributet data-repeterbar till true.

*I det exempel som beskrivs finns två Div-element högst upp i den anpassade mallen. Den första, med CSS-klassen"__FP_boxes-container", fungerar som ett behållarelement för de formulär som visas. Den andra, med CSS-klassen"__FP_boxes", är en mall för de grundläggande entiteterna, i det här fallet ett formulär. The data-repeterbar attributet i Div-elementet har värdet true.

Varje platshållare har en exklusiv OTB-metadatauppsättning. Om du vill visa anpassade metadata på en viss plats i formuläret lägger du till Egenskapen $metadata_prop på stället.

I exemplet används metadataegenskapen i flera instanser. Den används till exempel i description,name,formUrl,htmlStyle,pdfUrl,pdfStyle ​och bana ​på föreskrivet sätt.

Inga metadata out-of-the-box-metadata

Olika Forms Portal-komponenter innehåller exklusiva uppsättningar OTB-metadata som du kan använda för att visa en lista.

Komponenten Search & Lister search-amp-lister-component

  • Titel: Formulärets namn

  • name: Formulärets namn (oftast är det samma som titeln)

  • description: Beskrivning av formuläret

  • formUrl: URL för att återge formuläret som HTML

  • pdfUrl: URL för att återge formuläret som PDF

  • assetType: Typ av tillgång. Giltiga värden är Formulär, PDF Form, Skriv ut formulär och Adaptiv form

  • htmlStyle & pdfStyle: Visningsformat för HTML och PDF som används för återgivning. Giltiga värden är __FP_display_none" eller blank

    Obs! Kom ihåg att använda klassen __FP_display_none i din anpassade formatmall

  • downloadUrl: URL för att hämta en resurs.

Stöd för lokalisering, sortering och användning av konfigurationsegenskaper i användargränssnittet (endast sökning och lister):

  1. Lokaliseringsstöd: Använd attributet för att lokalisera statisk text ${localize-DIN_TEXT​} och göra det lokaliserade värdet tillgängligt, om det inte redan finns.

    I det exempel som behandlas används attributen ${localize-Apply} och ${localize-Download} för att lokalisera texten Använd och Hämta.

  2. Stöd för sortering: Klicka på elementet HTML för att sortera sökresultaten. Om du vill implementera sortering i en skickad layout lägger du till attributet data-sortKey i den aktuella tabellrubriken. Lägg dessutom till dess värde som de metadata som du vill sortera efter.

    För rubrikrubriken i stödrastervyn är värdet för rubriken"data-sortKey" till exempel"title". Klicka på rubriken om du vill sortera värdena i en viss kolumn.

  3. Använda konfigurationsegenskaper: Komponenten Sök och visa har flera konfigurationer som du kan använda i användargränssnittet. Om du till exempel vill visa HTML-verktygstipstext som har sparats i redigeringsdialogrutan använder du ${config-htmlLinkText}-attribut. På samma sätt kan du använda kommandot ${config-pdfLinkText} -attribut.

  • Titel: Formulärets namn
  • formUrl: URL för att återge formuläret som HTML
  • target: Länkens målattribut. Giltiga värden är "_blank" och "_self".
  • linkText: Länkbeskrivning

Komponenten Utkast och inskickat material drafts-amp-submissions-component

  • Bana: Sökväg till metadatanoden för utkast/överföringar. Använd det med tillägget .HTML som en URL för att öppna ett utkast eller en sändning.
  • contextPath: AEM kontextsökväg
  • firstLetter: Första bokstaven (versaler) i titeln på det adaptiva formuläret, som sparats som utkast eller skickad.
  • formName: Titeln på det adaptiva formuläret, som har sparats som utkast eller skickats.
  • draftID: ID för det utkast som visas (Använd bara i mallen för avsnittet Utkast).
  • submitID: ID för överföringen som visas (Använd bara i mallen för avsnittet Skicka).
  • status: Status för det skickade formuläret. (Använd endast i mallen för avsnittet Skicka).
  • description: Beskrivning av det adaptiva formulär som är kopplat till utkastet eller inlämningen.
  • diffTime: Skillnaden mellan aktuell tid och den senaste sparåtgärden för utkastet. Alternativt kan det vara en skillnad mellan den aktuella tiden och den senaste sändningsåtgärden för överföringen.
  • iconClass: CSS-klass som används för att visa den första bokstaven i utkastet/sändningen. Forms Portal innehåller följande klasser med olika färgade bakgrunder.
  • ägare: Användare som skapade utkastet/överföringen.
  • Idag: Datum då utkastet eller inlämningen skapades i DDYYYY-format.
  • TimeNow: Tid då utkastet eller inlämningen skapades i HHSS 24-timmarsformat

Obs!

  1. Om du vill ta bort alternativet i avsnittet Utkast under komponenten Utkast och överföringar ska du ge CSS-klassen namnet"__FP_deleteDraft". Inkludera dessutom attributet "draftID" med värdet ${draftID}, som är utkastets ID.

  2. När du skapar länkar till öppna utkast och inskickade dokument kan du ange $path.html som värdet för href -attribut för ankartaggen.

Utkast och inskickningsnod

A. Behållarelement

B. "path"-metadata med en fast hierarki för att få miniatyrbilder lagrade för varje formulär.

C. Attribut som kan upprepas för varje formulär i mallavsnittet

D. För att lokalisera strängen "Använd"

E. Använda konfigurationsegenskapen pdfLinkText

F. Använda metadata för pdfUrl

Tips, tricks och kända fel tips-tricks-and-known-issues

  1. Använd inte enkla citattecken (') i någon anpassad mall.
  2. För anpassade metadata sparar du den här egenskapen på jcr:innehåll/metadata endast nod. Om du lagrar det på något annat ställe kan inte Forms Portal visa metadata.
  3. Kontrollera att namnet på anpassade metadata eller befintliga metadata inte innehåller ett kolon (:). Om det gör det kan du inte visa det i användargränssnittet.
  4. data-repeterbar har ingen betydelse för Länk -komponenten. Adobe rekommenderar att du undviker att använda den här egenskapen i mallen för en länkkomponent.

Relaterade artiklar

recommendation-more-help
a6ebf046-2b8b-4543-bd46-42a0d77792da