Community Components Guide community-components-guide
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 getting-started
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:
-
Standaardinterface:
https://<server>:<port>/editor.html/content/community-components/en.html
-
Klassieke interface:
https://<server>:<port>/cf#/content/community-components/en.html
Startpagina home-page
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:
Componentpagina's component-pages
Selecteer een component in de lijst links op de pagina.
De hoofdtekst van de hulplijn wordt weergegeven:
-
Titel: De naam van de geselecteerde component
-
Clientbibliotheken: Een lijst van een of meer verplichte categorieën
-
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
-
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.
Interacties tussen auteurs author-interactions
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:
Onder de Sjablonen tab:
-
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 publish-interactions
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.
Client-Side bibliotheken client-side-libraries
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 impersonation
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 customization
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 enabling-customization
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:
-
Bladeren naar CRXDE Lite
Bijvoorbeeld: http://localhost:4503/crx/de
-
Selecteer de componenten
jcr:contentnodeBijvoorbeeld,
/content/community-components/en/comments/jcr:content -
Een eigenschap toevoegen
- Naam
scg:showIde - Type
String - Waarde
true
- Naam
-
Selecteer Save All
-
Laad de pagina Opmerkingen in de handleiding opnieuw
http://localhost:4503/content/community-components/en/comments.html
-
Er zijn nu drie tabbladen voor sjablonen, CSS en gegevens.
Tabblad Sjablonen templates-tab
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 css-tab
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 data-tab
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.