Componentpictogrammen aanpassen developing-component-icons-in-aem-sites
Met componentpictogrammen kunnen auteurs snel een component met pictogrammen of betekenisvolle afkortingen identificeren. Auteurs kunnen nu de Componenten vinden die nodig zijn om hun webervaringen sneller dan ooit uit te bouwen.
De Componentbrowser wordt nu in een consistent grijs thema weergegeven, met daarin het volgende:
-
Component Group
-
Component Title
-
Component Description
-
Component Icon
- De eerste twee letters van de Titel van de Component (gebrek)
- Aangepaste PNG-afbeelding (geconfigureerd door een ontwikkelaar)
- Aangepaste SVG-afbeelding (geconfigureerd door een ontwikkelaar)
- Het pictogram CoralUI (gevormd door een ontwikkelaar)
Opties voor configuratie van componentpictogrammen component-icon-configuration-options
Afkortingen abbreviations
Door gebrek, worden de eerste 2 karakters van componententitel ([cq:Component ]@jcr:title) gebruikt als afkorting. Bijvoorbeeld, als [cq:Component ]@jcr:title=Article Lijst de afkorting als "Ar"zou tonen.
De afkorting kan via [worden aangepast cq:Component ]@abbrelayback bezit. Hoewel deze waarde meer dan 2 tekens kan bevatten, wordt aangeraden de afkorting te beperken tot 2 tekens om visuele stoornissen te voorkomen.
/apps/.../components/content/my-component
- jcr:primaryType = "cq:Component"
- abbreviation = "AL"
CoralUI-pictogrammen coralui-icons
CoralUI-pictogrammen, geleverd door AEM, kunnen worden gebruikt voor componentpictogrammen. Om een pictogram CoralUI te vormen, plaats a [cq:Component ]@cq:pictogram bezit aan de gewenste het pictogramkenmerkwaarde van HTML van het pictogram CoralUI (die in de documentatie CoralUI wordt opgesomd.
/apps/.../components/content/my-component
- jcr:primaryType = "cq:Component"
- cq:icon = "documentFragment"
PNG-afbeeldingen png-images
PNG-afbeeldingen kunnen worden gebruikt voor componentpictogrammen. Om een beeld PNG als componentenpictogram te vormen, voeg het gewenste beeld als a niet toe:dossier genoemd cq:icon.png onder [cq:Component].
PNG zou een transparante achtergrond moeten hebben, of een achtergrondkleur die aan #707070 wordt geplaatst.
De beelden PNG worden geschraapt aan 20px door 20px. Nochtans om netvliesvertoningen 40px door 40px aan te passen zou verkiesbaar kunnen zijn.
/apps/.../components/content/my-component
- jcr:primaryType = "cq:Component"
+ cq:icon.png
- jcr:primaryType = "nt:file"
SVG-afbeeldingen svg-images
SVG-afbeeldingen (op basis van vectoren) kunnen worden gebruikt voor componentpictogrammen. Om een beeld van SVG als componentenpictogram te vormen, voeg gewenste SVG als a toe:dossier genoemd cq:icon.svg onder [cq:Component].
De beelden van SVG zouden een achtergrondkleur moeten hebben die aan wordt geplaatst#707070 en een grootte van 20px door 20px.
/apps/.../components/content/my-component
- jcr:primaryType = "cq:Component"
+ cq:icon.svg
- jcr:primaryType = "nt:file"