Handbuch der Community-Komponenten community-components-guide

Das Community Components Guide ist ein interaktives Entwicklungstool für das Social Component Framework (SCF). Es enthält eine Liste der verfügbaren Adobe Experience Manager (AEM)-Communities-Komponenten oder der komplexeren Funktionen, die aus mehreren Komponenten erstellt wurden.

Neben grundlegenden Informationen zu den einzelnen Komponenten ermöglicht das Handbuch Experimente mit der Funktionsweise der SCF-Komponenten/-Funktionen und der Möglichkeit, sie zu konfigurieren oder anzupassen.

Informationen zu den Entwicklungsgrundlagen für jede Komponente finden Sie unter Funktions- und Komponentengrundlagen.

Erste Schritte getting-started

Das Handbuch ist für die Verwendung in Entwicklungsinstallationen von Autoreninstanzen (localhost:4502) und Veröffentlichungsinstanzen (localhost:4503) vorgesehen.

Die Community-Komponenten-Website finden Sie unter

Die Interaktionen mit den Communitys-Komponenten variieren je nach:

Um in der Autoreninstanz in den Bearbeitungsmodus zu wechseln, fügen Sie nach dem Servernamen als erstes Pfadsegment entweder editor.html oder cf# ein:

Startseite home-page

Das Handbuch enthält eine Liste der SCF-Komponenten, die links auf der Seite für Vorschau und Prototyping verfügbar sind.

Komponentenleitfaden, wie in einer Autoreninstanz im Bearbeitungsmodus angezeigt:

Komponentenseiten component-pages

Wählen Sie links auf der Seite in der Liste eine Komponente aus.

Der Hauptteil des Handbuchs zeigt Folgendes an:

Autoreninteraktionen author-interactions

Bei Verwendung des Handbuchs auf einer Autoreninstanz ist es möglich, die Konfiguration einer Komponente durch Öffnen des entsprechenden Dialogfelds zu erleben. Informationen für Entwickler finden Sie im Abschnitt Komponenten und) der Dokumentation, während die Dialogeinstellungen für Autoren im Abschnitt Communities-Komponenten beschrieben werden.

Für das Handbuch der Community-Komponenten werden einige Einstellungen für das Komponentendialogfeld mit dem Einschließbar-Umschalter überlagert. Um zwischen der Verwendung der vorhandenen Ressource oder einer dynamisch eingeschlossenen Ressource umzuschalten, wählen Sie im Bearbeitungsmodus sowohl die Komponente als auch den einzuschließenden Text aus und doppelklicken Sie, um das Dialogfeld „Bearbeiten“ zu öffnen:

Auf der Registerkarte Vorlagen:

Publish Interactions publish-interactions

Bei Verwendung des Handbuchs auf einer Veröffentlichungsinstanz können die Komponenten und Funktionen als Site-Besucher (nicht angemeldet) und als Mitglieder mit verschiedenen Berechtigungen erleben, wenn sie angemeldet sind.

Client-seitige Bibliotheken client-side-libraries

Die für jede Komponente aufgelisteten Client-seitigen Bibliotheken (clientlibs) sind die (), beim Platzieren der Komponente auf einer Seite referenziert werden müssen. Die Clientlibs bieten eine Möglichkeit zur Verwaltung und Optimierung des Downloads von JavaScript und CSS, die zum Rendern der Komponente im Browser verwendet werden.

Weitere Informationen finden Sie unter Clientlibs für Communities-Komponenten.

Personifikation impersonation

Verwenden Sie auf der Autoreninstanz, bei der häufig eine Person als Administrator oder Entwickler angemeldet ist, um die als ein anderer Benutzer angemeldete Komponente zu verwenden, das Textfeld links neben der Schaltfläche Identität annehmen, um entweder den Benutzernamen einzugeben oder aus der Pulldown-Liste auszuwählen, und klicken Sie dann auf die Schaltfläche. Klicken Sie auf Wiederherstellen , um sich abzumelden und den Identitätswechsel zu beenden.

Für die Veröffentlichungsinstanz ist keine Stellvertretung erforderlich. Verwenden Sie einfach den Anmelde-/Abmelde-Link, um die Identität verschiedener Benutzer anzunehmen, z. B Demo-Benutzer.

Anpassung customization

Wenn diese Option aktiviert ist, ist jede SCF-Komponente für das Prototyping möglicher Anpassungen verfügbar, indem die Vorlage, das CSS und die Daten der Komponente vorübergehend geändert werden.

Aktivieren der Anpassung enabling-customization

Um schnell mit Anpassungen zu experimentierenscg:showIde muss die Eigenschaft zum Inhalts-JCR-Knoten der Komponentenseite hinzugefügt und auf „true“ gesetzt werden.

Verwenden Sie die Komponente Kommentare als Beispiel für die Autoren- oder Veröffentlichungsinstanz, die mit Administratorrechten angemeldet ist:

Registerkarte „Vorlagen“ templates-tab

Wählen Sie die Registerkarte Vorlagen aus, um die mit der Komponente verknüpften Vorlagen anzuzeigen.

Mit dem Vorlageneditor können lokale Bearbeitungen kompiliert und auf die Beispielkomponenteninstanz oben auf der Seite angewendet werden, ohne dass die Komponente im Repository betroffen ist.

Wenn Sie den Compiler für lokale Bearbeitungen ausführen, werden alle Fehler hervorgehoben, indem Sie einen Punkt in den Rinnstein platzieren und den Text rot markieren.

Registerkarte CSS css-tab

Wählen Sie die Registerkarte CSS aus, um das mit der Komponente verknüpfte CSS anzuzeigen.

Wenn eine Komponente aus mehreren Komponenten zusammengesetzt ist, können einige CSS-Elemente unter einer der anderen Komponenten aufgeführt werden.

Der CSS-Editor ermöglicht das Ändern des CSS und dessen Anwendung auf die Beispielkomponenteninstanz oben auf der Seite.

Sie können eine Regel auswählen, um die Teile des DOM mithilfe dieser Regel hervorzuheben, indem Sie neben der Regel im Rinnstein klicken.

Registerkarte „Daten“ data-tab

Wählen Sie die Registerkarte Daten aus, um die .social.json-Endpunktdaten anzuzeigen. Diese Daten können bearbeitet werden und werden auf die Beispielkomponenteninstanz angewendet.

Syntaxfehler können in der Rinne markiert und im Editor hervorgehoben werden.