Paginasjablonen - statisch

Een malplaatje wordt gebruikt om een Pagina tot stand te brengen en bepaalt welke componenten binnen het geselecteerde werkingsgebied kunnen worden gebruikt. Een sjabloon is een hiërarchie van knooppunten die dezelfde structuur heeft als de pagina die moet worden gemaakt, maar zonder daadwerkelijke inhoud.

Elke sjabloon bevat een selectie van componenten die beschikbaar zijn voor gebruik.

  • Sjablonen zijn opgebouwd uit Componenten;
  • Componenten gebruiken widgets en staan toegang tot deze widgets toe. Deze worden gebruikt om de inhoud te renderen.
OPMERKING

Bewerkbare sjablonen zijn ook beschikbaar en zijn het aanbevolen type sjablonen voor de meeste flexibiliteit en de nieuwste functies.

Eigenschappen en onderliggende knooppunten van een sjabloon

Een sjabloon is een knooppunt van het type cq:Template en heeft de volgende eigenschappen en onderliggende knooppunten:

Naam
Type
Beschrijving
.
cq:sjabloon Huidige sjabloon. Een sjabloon is van het knooppunttype cq:Template.
allowedChildren Tekenreeks[] Pad van een sjabloon dat een onderliggend element van deze sjabloon mag zijn.
allowedParents Tekenreeks[] Pad van een sjabloon dat bovenliggend element van deze sjabloon mag zijn.
allowedPaths Tekenreeks[] Pad van een pagina die mag worden gebaseerd op deze sjabloon.
jcr:gemaakt Date Aanmaakdatum van de sjabloon.
jcr:beschrijving Tekenreeks Beschrijving van de sjabloon.
jcr:titel Tekenreeks Titel van de sjabloon.
rangschikking Lang Rank van de sjabloon. Gebruikt om het malplaatje in het Gebruikersinterface te tonen.
jcr:inhoud cq:PageContent Knooppunt met de inhoud van de sjabloon.
thumbnail.png nt:bestand Miniatuur van de sjabloon.
icon.png nt:bestand Pictogram van de sjabloon.

Een sjabloon is de basis van een pagina.

Als u een pagina wilt maken, moet de sjabloon worden gekopieerd (knooppunt-boomstructuur /apps/<myapp>/template/<mytemplate>) naar de corresponderende positie in de sitestructuur: Dit gebeurt als een pagina wordt gemaakt met het tabblad Websites.

Deze kopieeractie geeft de pagina ook zijn aanvankelijke inhoud (gewoonlijk Top-Level Inhoud slechts) en het bezit die:resourceType, de weg aan de paginacomponent plaatsen die wordt gebruikt om de pagina (alles in de kindknoop jcr:content) terug te geven.

Hoe sjablonen zijn gestructureerd

Er zijn twee aspecten die in overweging moeten worden genomen:

  • de structuur van de template zelf
  • de structuur van de inhoud die wordt geproduceerd wanneer een sjabloon wordt gebruikt

De structuur van een sjabloon

Een malplaatje wordt gecreeerd onder een knoop van type cq:Malplaatje.

screen_shot_2012-02-13at63646pm

Er kunnen verschillende eigenschappen worden ingesteld, met name:

  • jcr:title - titel voor de sjabloon; wordt weergegeven in het dialoogvenster wanneer u een pagina maakt.
  • jcr:description - description for the template; wordt weergegeven in het dialoogvenster wanneer u een pagina maakt.

Dit knooppunt bevat een knooppunt jcr:content (cq:PageContent) dat wordt gebruikt als basis voor het inhoudsknooppunt van de resulterende pagina's; deze verwijzingen, gebruikend sling:resourceType, de component die voor het teruggeven van de daadwerkelijke inhoud van een nieuwe pagina moet worden gebruikt.

screen_shot_2012-02-13at64010pm

Deze component wordt gebruikt om de structuur en het ontwerp van de inhoud te bepalen wanneer een nieuwe pagina wordt gecreeerd.

screen_shot_2012-02-13at64137pm

De inhoud die wordt geproduceerd door een sjabloon

Sjablonen worden gebruikt om pagina's van het type cq:Page te maken (zoals eerder vermeld, is een pagina een speciaal type component). Elke AEM heeft een gestructureerd knooppunt jcr:content. Dit:

  • is van het type cq:PageContent
  • is een gestructureerd knooppunttype dat een bepaalde content-definition bezit
  • heeft een eigenschap sling:resourceType om te verwijzen naar de component die de sling-scripts bevat die worden gebruikt voor het renderen van de inhoud

Standaardsjablonen

AEM wordt geleverd met een aantal standaardsjablonen die in het vak beschikbaar zijn. In sommige gevallen wilt u de sjablonen wellicht ongewijzigd gebruiken. In dat geval moet u ervoor zorgen dat de sjabloon beschikbaar is voor uw website.

AEM wordt bijvoorbeeld geleverd met verschillende sjablonen, waaronder een inhoudspagina en een homepage.

Titel Component Locatie Doel
Startpagina homepage geometrixx De sjabloon voor de startpagina van Geometrixx.
Inhoudspagina contentpagina geometrixx De sjabloon voor de inhoudspagina van Geometrixx.

Standaardsjablonen weergeven

Ga als volgt te werk om een lijst met alle sjablonen in de repository weer te geven:

  1. Open in CRXDE Lite het menu Tools en klik op Query.

  2. Op het tabblad Query

  3. Als Type, selecteer XPath.

  4. Voer in het invoerveld Query de volgende tekenreeks in:

    //element(*, cq:Template)

  5. Klik Uitvoeren. De lijst wordt weergegeven in het vak Resultaat.

In de meeste gevallen neemt u een bestaande sjabloon en ontwikkelt u een nieuwe sjabloon voor eigen gebruik. Zie Paginasjablonen ontwikkelen voor meer informatie.

Als u een bestaande sjabloon voor uw website wilt inschakelen en u wilt dat deze wordt weergegeven in het dialoogvenster Pagina maken wanneer u een pagina maakt die recht staat onder Websites in de console Websites, stelt u de eigenschap allowedPaths van het sjabloonknooppunt in op: /content(/.*?lang=nl)?

Hoe sjabloonontwerpen worden toegepast

Wanneer de stijlen in UI gebruikend de Wijze van het Ontwerp worden bepaald, wordt het ontwerp voortgeduurd bij de nauwkeurige weg van de inhoudsknoop waarvoor de stijl wordt bepaald.

LET OP

Adobe raadt u aan alleen ontwerpen toe te passen via Ontwerpmodus.

Het aanpassen van ontwerpen in bijvoorbeeld CRX DE is geen goede praktijk en de toepassing van dergelijke ontwerpen kan van verwacht gedrag variëren.

Als ontwerpen alleen worden toegepast in de ontwerpmodus, zijn de volgende secties Ontwerppadresolutie, Beslissingsstructuur en Voorbeeld niet van toepassing.

OPMERKING

In deze sectie wordt het gedrag van de ontwerppadresolutie vanaf AEM 6.4.2.0 beschreven.

Resolutie van ontwerppad

Wanneer het teruggeven van inhoud die op een statisch malplaatje wordt gebaseerd, AEM zal proberen om het meest relevante ontwerp en de stijlen op de inhoud toe te passen die op een traversal van de inhoudshiërarchie wordt gebaseerd.

AEM bepaalt de meest relevante stijl voor een inhoudsknoop in de volgende orde:

  • Als er een ontwerp is voor het volledige en nauwkeurige pad van het inhoudsknooppunt (zoals wanneer het ontwerp is gedefinieerd in de ontwerpmodus), gebruikt u dat ontwerp.
  • Als er een ontwerp is voor het inhoudsknooppunt van het bovenliggende element, gebruikt u dat ontwerp.
  • Als er een ontwerp voor om het even welke knoop op de weg van de inhoudsknoop is, dan gebruik dat ontwerp.

In de laatste twee gevallen, als er meer dan één toepasselijk ontwerp is, gebruik het één dichtst bij de inhoudsknoop.

Beslissingsstructuur

Dit is een grafische weergave van de logica Ontwerppadresolutie.

design_path_resolution

Voorbeeld

U kunt een eenvoudige inhoudsstructuur als volgt gebruiken, waarbij een ontwerp van toepassing kan zijn op elk van de knooppunten:

/root/branch/leaf

In de volgende tabel wordt beschreven hoe AEM een ontwerp kiest.

Ontwerp zoeken voor
Ontwerpen bestaan voor
Element gekozen
Opmerking
leaf

root

branch

leaf

leaf De meest nauwkeurige gelijke wordt altijd genomen.
leaf

root

branch

branch Ga terug naar de dichtstbijzijnde match onder in de boom.
leaf root root Als al anders ontbreekt, neem wat overblijft.
branch branch branch
branch

branch

leaf

branch
branch

root

branch

branch
branch

root

leaf

root

Als er geen exacte overeenkomst is, neemt u de onderste in de boom.

De veronderstelling is dat dit altijd van toepassing zal zijn, maar verder omhoog kan de boom te specifiek zijn.

Paginasjablonen ontwikkelen

AEM paginasjablonen zijn gewoon modellen waarmee nieuwe pagina's worden gemaakt. Zij kunnen zo weinig, of zo veel, aanvankelijke inhoud bevatten zoals nodig, hun rol om de correcte aanvankelijke knoopstructuren tot stand te brengen, met de vereiste eigenschappen (hoofdzakelijk sling:resourceType) die worden geplaatst om het uitgeven en het teruggeven toe te staan.

Een nieuwe sjabloon maken (op basis van een bestaande sjabloon)

Een nieuwe sjabloon kan natuurlijk helemaal vanaf het begin worden gemaakt, maar vaak wordt een bestaande sjabloon gekopieerd en bijgewerkt om tijd en moeite te besparen. U kunt bijvoorbeeld de sjablonen in Geometrixx gebruiken om aan de slag te gaan.

Een nieuwe sjabloon maken op basis van een bestaande sjabloon:

  1. Kopieer een bestaande sjabloon (bij voorkeur met een definitie die zo dicht mogelijk bij wat u wilt bereiken) naar een nieuw knooppunt.

    Sjablonen worden meestal opgeslagen in /apps/<website-name>/templates/<template-name>.

    OPMERKING

    De lijst met beschikbare sjablonen is afhankelijk van de locatie van de nieuwe pagina en de plaatsingsbeperkingen die in elke sjabloon zijn opgegeven. Zie Beschikbaarheid sjabloon.

  2. Wijzig jcr:title van het nieuwe sjabloonknooppunt om de nieuwe rol ervan te weerspiegelen. U kunt jcr:description indien van toepassing ook bijwerken. Zorg ervoor dat u de sjabloonbeschikbaarheid van de pagina naar wens wijzigt.

    OPMERKING

    Als u wilt dat uw sjabloon wordt weergegeven in het dialoogvenster Pagina maken wanneer u een pagina maakt die recht onder Websites via de Websites-console wordt weergegeven, stelt u de eigenschap allowedPaths van het sjabloonknooppunt in op: /content(/.*)?

    chlimage_1-251

  3. Kopieer de component waarop de sjabloon is gebaseerd (dit wordt aangegeven door de eigenschap sling:resourceType van het knooppunt jcr:content in de sjabloon) om een nieuwe instantie te maken.

    Componenten worden meestal opgeslagen in /apps/<website-name>/components/<component-name>.

  4. Werk jcr:title en jcr:description van de nieuwe component bij.

  5. Vervang de miniatuur.png als u een nieuwe miniatuurafbeelding wilt weergeven in de lijst met sjabloonselecties (grootte 128 x 98 px).

  6. Werk sling:resourceType van de knoop jcr:content van het malplaatje bij om naar de nieuwe component te verwijzen.

  7. Breng verdere wijzigingen aan in de functionaliteit of het ontwerp van de sjabloon en/of de onderliggende component.

    OPMERKING

    Wijzigingen die worden aangebracht in het knooppunt /apps/<website>/templates/<template-name> hebben invloed op de sjablooninstantie (zoals in de selectielijst).
    Wijzigingen die worden aangebracht in het knooppunt /apps/<website>/components/<component-name> hebben invloed op de inhoudspagina die wordt gemaakt wanneer de sjabloon wordt gebruikt.

    U kunt nu een pagina binnen uw website maken met de nieuwe sjabloon.

OPMERKING

In de clientbibliotheek van de editor wordt ervan uitgegaan dat de naamruimte cq.shared aanwezig is op inhoudspagina's. Als deze ontbreekt, resulteert de JavaScript-fout Uncaught TypeError: Cannot read property 'shared' of undefined.
Alle pagina's met voorbeeldinhoud bevatten cq.shared, dus alle inhoud die hierop is gebaseerd, bevat automatisch cq.shared. Als u echter besluit uw eigen inhoudspagina's helemaal zelf te maken zonder deze op voorbeeldinhoud te baseren, moet u de naamruimte cq.shared invoegen.
Zie Client-Side Libraries gebruiken voor meer informatie.

Een bestaande sjabloon beschikbaar maken

In dit voorbeeld wordt getoond hoe u een sjabloon kunt gebruiken voor bepaalde inhoudspaden. De sjablonen die beschikbaar zijn voor de auteur van de pagina wanneer u nieuwe pagina's maakt, worden bepaald door de logica die is gedefinieerd in Beschikbaarheid van sjabloon.

  1. Navigeer in CRXDE Lite naar de sjabloon die u voor de pagina wilt gebruiken, bijvoorbeeld de sjabloon Nieuwsbrief.

  2. Wijzig de allowedPaths-eigenschap en andere eigenschappen die worden gebruikt voor sjabloonbeschikbaarheid. Bijvoorbeeld allowedPaths: /content/geometrixx-outdoors/[^/]+(/.*)? betekent dat deze sjabloon is toegestaan in elk pad onder /content/geometrixx-outdoors.

    chlimage_1-252

Op deze pagina