Documentatie AEM 6.4 Gids voor formulieren

Een aangepaste aangepaste formuliersjabloon maken

Laatst bijgewerkt: 4 mei 2023

Gemaakt voor:

User

CAUTION

AEM 6.4 heeft het einde van de uitgebreide ondersteuning bereikt en deze documentatie wordt niet meer bijgewerkt. Raadpleeg voor meer informatie onze technische ondersteuningsperioden. Ondersteunde versies zoeken hier.

Vereisten

Inzicht in AEM Paginasjabloon en Adaptief ontwerpen van formulieren
Inzicht in AEM Client Side Libraries

Adaptief formuliersjabloon

Een adaptieve formuliersjabloon is gespecialiseerd AEM Paginasjabloon, met bepaalde eigenschappen en inhoudsstructuur die worden gebruikt om een adaptief formulier te maken. De sjabloon heeft vooraf geconfigureerde lay-outs, stijlen en initiële basisinhoudsstructuur.

Als u een formulier hebt gemaakt, worden wijzigingen in de oorspronkelijke structuur van de sjablooninhoud niet meer doorgevoerd in het formulier.

Standaard adaptieve formuliersjablonen

AEM QuickStart bevat de volgende adaptieve formuliersjablonen:

Eenvoudig: Hiermee kunt u een adaptief formulier met meerdere tabbladen maken met een lay-out voor tabbladen links, waar u tabbladen in willekeurige volgorde kunt bekijken.
Basis met Acrobat Sign: Hiermee kunt u een formulier maken met meerdere tabbladen en wizard. Er wordt een lay-out met tabs links gebruikt waarmee u tabbladen in willekeurige volgorde kunt bezoeken. Voor ondertekening en verificatie worden Adobe Document Cloud-ontwerpservices gebruikt.
Lege sjabloon: Hiermee kunt u een formulier maken zonder koptekst, voettekst en eerste inhoud. U kunt componenten toevoegen, zoals tekstvakken, knoppen en afbeeldingen. Met de lege sjabloon kunt u een formulier maken dat u kunt insluiten in AEM sitepagina's.

Deze sjablonen bevatten de sling:resourceType eigenschap ingesteld op de overeenkomende pagina-component. De paginacomponent geeft de CQ-pagina weer, die een adaptieve formuliercontainer bevat, die op zijn beurt weer een adaptief formulier maakt.

In de volgende tabel wordt de koppeling tussen sjablonen en paginacomponent opgesomd:

Sjabloon	Pagina-component
/libs/fd/af/templates/surveyTemplate	/libs/fd/af/components/page/survey
/libs/fd/af/templates/simpleEnrollmentTemplate	/libs/fd/af/components/page/base
/libs/fd/af/templates/tabbedEnrollmentTemplate	/libs/fd/af/components/page/tabbedenrollment
/libs/fd/afaddon/templates/advancedEnrollmentTemplate	/libs/fd/afaddon/components/page/advancedRolment

Een aangepaste formuliersjabloon maken met behulp van een sjablooneditor

U kunt de structuur en de initiële inhoud van een adaptief formulier opgeven met de Sjablooneditor. U wilt bijvoorbeeld dat alle formulierauteurs weinig tekstvakken, navigatieknoppen en een verzendknop in een inschrijvingsformulier hebben. U kunt een sjabloon maken die auteurs kunnen gebruiken om een formulier te maken dat consistent is met andere inschrijvingsformulieren. Met AEM Sjablooneditor kunt u:

Koptekst- en voettekstcomponenten van een formulier toevoegen in de structuurlaag
Geef de initiële inhoud voor het formulier op.
Geef een thema op.
Geef handelingen op, zoals Verzenden, Herstellen en Navigeren.

Zie voor meer informatie Sjablooneditor.

Een adaptieve formuliersjabloon maken op basis van CRXDE

In plaats van de beschikbare sjablonen te gebruiken, kunt u een sjabloon maken en deze gebruiken om adaptieve formulieren te maken. Aangepaste sjablonen zijn gebaseerd op verschillende paginacomponenten die verwijzen naar aangepaste formuliercontainers en pagina-elementen, zoals kop- en voettekst.

U kunt deze componenten maken met de basispaginacomponent voor uw website. U kunt ook de paginacomponent van het adaptieve formulier uitbreiden die in de vaksjablonen wordt gebruikt.

Voer de volgende stappen uit om een douanemalplaatje, zoals simpleEnrollmentTemplate tot stand te brengen.

Navigeer naar CRXDE Lite op de ontwerpinstantie.
Maak onder de map /apps de mapstructuur voor uw toepassing. Als de toepassingsnaam bijvoorbeeld mijn bedrijf is, maakt u een map met deze naam. De toepassingsmap bevat doorgaans componenten, configuratie, sjablonen, bron en installatiemappen. In dit voorbeeld maakt u de mappen voor componenten, configuratie en sjablonen.
Navigeer naar de map /libs/fd/af/templates.
Kopieer de simpleEnrollmentTemplate knooppunt.
Navigeer naar de map /apps/mijnbedrijf/sjablonen. Klik er met de rechtermuisknop op en selecteer Paste.
Wijzig zo nodig de naam van het sjabloonknooppunt dat u hebt gekopieerd. Wijzig bijvoorbeeld de naam ervan in een inschrijfsjabloon.
Navigeer naar de locatie /apps/mijnbedrijf/sjablonen/inschrijvingssjabloon.
De jcr:title en jcr:description eigenschappen voor de jcr:content knoop om het malplaatje van het malplaatje te onderscheiden u kopieerde.
De jcr:content het knooppunt van de gewijzigde sjabloon bevat het guideContainer en guideformtitle componenten. guideContainer is de container die het adaptieve formulier bevat. De guideformtitle geeft de toepassingsnaam, beschrijving enzovoort weer.

In plaats van guideformtitle, kunt u een aangepaste component of de parsys component. Verwijder bijvoorbeeld guideformtitleen voegt u een aangepaste component of de parsys componentknooppunt. Zorg ervoor dat de sling:resourceType eigenschap van de component verwijst naar de component en hetzelfde wordt gedefinieerd op de pagina component.jsp bestand.
Navigeer naar de locatie /apps/mijnbedrijf/sjablonen/inschrijving-sjabloon/jcr:content.
Open de Properties en wijzigt u de waarde van de optie cq:designPath eigenschap aan /etc/designs/mijnbedrijf.
Maak nu een /etc/designs/mycompany-knooppunt voor de cq:Page type.

Een adaptief onderdeel van een formulierpagina maken

De aangepaste sjabloon heeft dezelfde opmaak als de standaardsjabloon, omdat de sjabloon verwijst naar de paginacomponent /libs/fd/af/components/page/base. U kunt de componentenverwijzing als bezit vinden sling:resourceType gedefinieerd op het knooppunt /apps/mijnbedrijf/sjablonen/inschrijving-sjabloon/jcr:content. Omdat de basis een kernproductcomponent is, wijzigt u deze component niet.

Navigeer naar het knooppunt /apps/mijnbedrijf/sjablonen/inschrijving-sjabloon/jcr:content en wijzig de waarde van de eigenschap sling:resourceType naar /apps/mijnbedrijf/componenten/pagina/inschrijfpagina
Kopieer het knooppunt /libs/fd/af/components/page/base naar de map /apps/mijnbedrijf/componenten/pagina.
De naam van de gekopieerde component wijzigen in enrollmentpage.
(Alleen als u al een inhoudspagina hebt) Voer de volgende stappen (a-d) uit als u een bestaande contentpagecomponent voor uw website. Als u geen bestaande contentpagekunt u de component voor uw website resourceSuperTypeeigenschap om naar de OOTB-basispagina te verwijzen.
1. Voor de enrollmentpage node, waarde instellen voor eigenschap sling:resourceSuperType naar mijnbedrijf/componenten/pagina/inhoudspagina. De contentpage is de basispaginacomponent voor uw site. Andere paginacomponenten kunnen het uitbreiden. Scriptbestanden verwijderen onder enrollmentpage, behalve head.jsp, content.jsp, en library.jsp. De sling:resourceSuperType component, die contentpage in dit geval, omvat al dergelijke manuscripten. Kopteksten, inclusief navigatiebalk en voettekst, worden overgenomen van de contentpage component.
2. Het bestand openen head.jsp.
  
  Het JSP-bestand bevat de regel <cq.include script="library.jsp"/>.
  
  De library.jsp bevat het bestand guide.theme.simpleEnrollment clientbibliotheek, die de opmaak voor het adaptieve formulier bevat.
  
  De component page enrollmentpage heeft een exclusieve head.jsp bestand dat het head.jsp van het contentpage component.
3. Alle scripts opnemen in het dialoogvenster head.jsp bestand voor de contentpage aan de head.jsp bestand voor de enrollmentpage component.
4. In de content.jsp , kunt u extra pagina-inhoud of verwijzingen naar andere componenten toevoegen die worden opgenomen wanneer een pagina wordt gerenderd. Als u bijvoorbeeld de aangepaste component toevoegt applicationformheader, zorg ervoor dat u de volgende verwijzing naar de component in het JSP dossier toevoegt:
  
  <cq:include path="applicationformheader" resourceType="mycompany/components/applicationformheader"/>
  
  Op dezelfde manier als u een parsys neemt ook de aangepaste component op in de sjabloonknooppuntstructuur.

Een adaptieve formulierclientbibliotheek maken

De head.jsp van het enrollmentpage component voor de nieuwe sjabloon bevat een clientbibliotheek guide.theme.simpleEnrollment. De standaardsjabloon gebruikt deze clientbibliotheek ook. Wijzig de stijl in de nieuwe sjabloon op een van de volgende manieren:

Een aangepast thema definiëren en het standaardthema vervangen guide.theme.simpleEnrollment met het aangepaste thema.
Definieer een nieuwe clientbibliotheek onder /etc/designs/mijnbedrijf. Neem de clientbibliotheek op na het standaardthemaitem in de jsp-pagina. Neem alle overschreven stijlen en extra JavaScript-bestanden op in deze clientbibliotheek.

NOTE

Thema verwijst naar een clientbibliotheek die is opgenomen in de paginacomponent die wordt gebruikt om een adaptief formulier te genereren. De clientbibliotheek is voornamelijk van toepassing op het uiterlijk van een adaptief formulier.

recommendation-more-help