Community Components Guide

Laatste update: 2023-05-04
  • Onderwerpen:
  • Communities
    Meer informatie over dit onderwerp
  • Gemaakt voor:
  • User
LET OP

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.

De Community Components Guide is een interactief ontwikkelingsinstrument voor de Sociaal-componentkader (SCF). Het biedt een lijst met beschikbare AEM Communities-componenten of de complexere functies van meerdere componenten.

Samen met basisinformatie voor elke component, staat de gids voor het experimenteren met toe hoe de componenten SCF/de eigenschappen werken en hoe zij kunnen worden gevormd of worden aangepast.

Voor informatie over de essentiële ontwikkelingsaspecten van elke component, zie Essentiële functies en componenten.

Aan de slag

De handleiding is bedoeld voor gebruik in ontwikkelinstallaties van de auteur (localhost:4502) en publiceer instanties (localhost:4503).

De site Community Components is toegankelijk door naar

De wisselwerking met de communautaire componenten is afhankelijk van:

  • De server (auteur of publicatie)
  • Of de bezoeker van de site zich al dan niet heeft aangemeld
  • Indien aangemeld, de aan het lid toegewezen rechten
  • Al dan niet de standaard SRP JSRP, is in gebruik

Als de auteur de bewerkingsmodus wil activeren, voegt u een van de volgende twee in editor.html of cf# als het eerste padsegment na de servernaam:

OPMERKING

Op auteur in Edit wijze, zijn de verbindingen op een pagina niet actief.

Als u naar een componentpagina wilt navigeren, selecteert u eerst de modus Voorbeeld om de koppelingen te activeren.

Wanneer de componentpagina in de browser wordt weergegeven, gaat u terug naar de modus Bewerken om het dialoogvenster voor bewerken van de component te openen.

Voor algemene ontwerpinformatie bekijkt u de snelle handleiding voor het ontwerpen van pagina's.

Als u niet bekend bent met AEM, kunt u de documentatie raadplegen op basisbehandeling.

Startpagina

De handleiding bevat een lijst met SCF-componenten die beschikbaar zijn voor voorvertoning en prototypen aan de linkerkant van de pagina.

De Gids van Componenten zoals bekeken op een auteursinstantie op Edit wijze:

chlimage_1-404

Componentpagina's

Selecteer een component in de lijst links op de pagina.

chlimage_1-405

De hoofdtekst van de hulplijn wordt weergegeven:

  1. Titel: De naam van de geselecteerde component

  2. Clientbibliotheken: Een lijst van een of meer verplichte categorieën

  3. Inclusief: Als de component dynamisch kan worden opgenomen, kunt u in de bewerkingsmodus van de auteur schakelen tussen de statussen:

    • Indien toegevoegd, wordt weergegeven tekst: "Deze component is opgenomen via het pari-knooppunt."
    • Indien inbegrepen, wordt weergegeven tekst: "Deze component wordt dynamisch opgenomen."
    • Indien niet inbegrepen, dan wordt geen tekst getoond
  4. Voorbeeldcomponent of -functie: een actieve instantie van de component of eigenschap. Als een component, kan het met veranderingen worden veranderd die in de malplaatjes, CSS en gegevens worden aangebracht die in de lusjesectie worden verstrekt.

OPMERKING

Nadat u links een selectie hebt gemaakt, wordt de component hieronder weergegeven in plaats van naast de componenten wanneer het browservenster te smal is.

Interacties tussen auteurs

Wanneer u de handleiding gebruikt voor een instantie van de auteur, kunt u het configureren van een component ervaren door het dialoogvenster te openen. Informatie voor ontwikkelaars is te vinden in het Grondbeginselen van componenten en functies in de documentatie, terwijl de dialoogvensterinstellingen worden beschreven in Community-componenten voor auteurs.

Voor de Community Components-handleiding worden bepaalde dialoogvensterinstellingen van componenten overschreven door de Inclusief schakelstatus. Als u wilt schakelen tussen het gebruik van de bestaande bron of een dynamisch opgenomen bron, selecteert u in de bewerkingsmodus zowel de component als de insluitende tekst en dubbelklikt u om het dialoogvenster Bewerken te openen:

chlimage_1-406

Onder de Sjablonen tab:

chlimage_1-407

  • Inclusief de onderliggende component met sling:include

    Als deze optie niet is ingeschakeld, gebruikt de Component Guide de bestaande bron in de repository (een jcr-knooppunt dat een onderliggend knooppunt is van een par-knooppunt).

    • weergegeven tekst is: "Deze component is opgenomen via het pari-knooppunt."

    Indien gecontroleerd, zal de Gids van de Component sling gebruiken om dynamisch een component van het resourceType van de kindknoop (niet-bestaande middel) te omvatten.

    • weergegeven tekst is: "Deze component wordt dynamisch opgenomen."

    De optie Standaard is uitgeschakeld.

Interacties publiceren

Wanneer u de handleiding gebruikt op een publicatie-instantie, kunt u de componenten en functies ervaren als bezoeker van de site (niet aangemeld) en als leden met verschillende bevoegdheden wanneer u zich hebt aangemeld.

OPMERKING

Houd rekening met het volgende als de SRP in gebreke blijft JSRP, is UGC die u hebt ingevoerd in de publicatie-instantie alleen zichtbaar bij publicatie en *niet *in het dialoogvenster matiging console op de auteurinstantie.

Client-Side bibliotheken

De client-side bibliotheken (clientlibs) die voor elke component worden vermeld, zijn de vereist waarnaar moet worden verwezen wanneer de component op een pagina wordt geplaatst. De clientlibs bieden een manier om het downloaden van Javascript en CSS die worden gebruikt om de component in de browser te renderen, te beheren en te optimaliseren.

Ga voor meer informatie naar Clientlibs voor Community-componenten.

Imitatie

Voor de auteurinstantie, waar men vaak als beheerder of ontwikkelaar wordt aangemeld, om de component te ervaren die als een andere gebruiker wordt aangemeld, gebruik het tekstvakje links van Impersonate om in de gebruikersnaam te typen of om een keuze te maken in de keuzelijst en vervolgens op de knop te klikken. Klik op Vorige versie om af te melden en de imitatie te beëindigen.

De publicatie-instantie hoeft zich niet voor te doen. U gebruikt gewoon de koppeling Aanmelden/Afmelden om verschillende gebruikers na te bootsen, zoals de demo-gebruikers.

Aanpassing

Wanneer toegelaten, is elke component SCF beschikbaar voor prototyping van mogelijke aanpassingen door het malplaatje van de component, CSS en gegevens tijdelijk te wijzigen.

Aanpassing inschakelen

OPMERKING

Dit gereedschap is alleen-lezen. Geen van de bewerkingen aan sjablonen, CSS of gegevens worden opgeslagen in de gegevensopslagruimte.

Als u snel wilt experimenteren met aanpassingen, scg:showIdeeigenschap moet worden toegevoegd aan het JCR-knooppunt voor inhoud van de componentpagina en op true worden ingesteld.

De component comments als voorbeeld gebruiken voor de auteur of de publicatie-instantie, aangemeld met beheerdersrechten:

  1. Bladeren naar CRXDE Lite

    Bijvoorbeeld: http://localhost:4503/crx/de

  2. Selecteer de componenten jcr:content node

    Bijvoorbeeld, /content/community-components/en/comments/jcr:content

  3. Een eigenschap toevoegen

    • Naam scg:showIde
    • Type String
    • Waarde true
  4. Selecteer Save All

  5. Laad de pagina Opmerkingen in de handleiding opnieuw

    http://localhost:4503/content/community-components/en/comments.html

  6. Er zijn nu drie tabbladen voor sjablonen, CSS en gegevens.

chlimage_1-408 chlimage_1-409

Tabblad Sjablonen

Selecteer het tabblad Sjablonen om de sjablonen weer te geven die aan de component zijn gekoppeld.

Met de Sjablooneditor kunnen lokale bewerkingen worden gecompileerd en toegepast op de voorbeeldcomponentinstantie boven aan de pagina zonder dat dit van invloed is op de component in de opslagplaats.

Wanneer compileert op lokale bewerkingen, worden eventuele fouten gemarkeerd door een punt in de tussenruimte te plaatsen en de tekst rood te markeren.

CSS-tabblad

Selecteer het tabblad CSS om de CSS weer te geven die aan de component is gekoppeld.

Als een component een samenstelling van veelvoudige componenten is, kan sommige CSS onder één van de andere componenten worden vermeld.

Met de CSS-editor kunt u de CSS wijzigen en toepassen op de voorbeeldcomponentinstantie boven aan de pagina.

U kunt een regel selecteren om de onderdelen van het DOM te markeren met behulp van die regel door naast de regel in de tussenruimte te klikken.

Tabblad Gegevens

Selecteer het lusje van Gegevens om de .social.json eindpuntgegevens te tonen. Dit gegeven is editable en wordt toegepast op de instantie van de steekproefcomponent.

Syntaxisfouten kunnen in de tussenruimte worden gemarkeerd en in de editor worden gemarkeerd.

Op deze pagina