Anpassung des Seiten-Authorings

Adobe Experience Manager as a Cloud Service bietet Mechanismen, mit denen Sie die Seitenbearbeitungsfunktion (und die Konsolen) Ihrer Authoring-Instanz.

Clientbibliotheken

Mit Clientlibs können Sie die Standardimplementierung erweitern, um neue Funktionen zu aktivieren und gleichzeitig die Standardfunktionen, -objekte und -methoden wiederzuverwenden.

Bei der Anpassung können Sie unter /apps. Ihre eigene Clientbibliothek erstellen. Die neue Clientbibliothek muss:

• Von der Authoring-Client-Bibliothek abhängig cq.authoring.editor.sites.page.
• Teil der entsprechenden cq.authoring.editor.sites.page.hook Kategorie.

Siehe Verwenden Client-seitiger Bibliotheken auf AEM as a Cloud Service.

Überlagerungen

Überlagerungen basieren auf Knotendefinitionen und ermöglichen es Ihnen, die Standardfunktionen in /libs mit Ihrer eigenen benutzerdefinierten Funktionalität in /apps.

Beim Erstellen einer Überlagerung ist keine 1:1-Kopie des Originals erforderlich, da die Sling Resource Merger ermöglicht die Vererbung.

Weitere Informationen finden Sie unter JS-Dokumentationssatz.

Weitere Informationen zu Überlagerungen finden Sie unter Überlagerungen für Adobe Experience Manager as a Cloud Service.

Neue Ebene hinzufügen (Modus)

Beim Bearbeiten einer Seite gibt es verschiedene Modi verfügbar. Diese Modi werden mithilfe von Ebenen. Diese ermöglichen den Zugriff auf verschiedene Funktionstypen für denselben Seiteninhalt. Zu den standardmäßigen AEM gehören Bearbeiten, Layout, Entwickler, Timewarp, Live Copy-Status und Targeting.

Ebenenbeispiel: Live Copy-Status

Eine standardmäßige AEM-Instanz stellt die MSM-Ebene bereit. Auf Daten im Zusammenhang mit Multisite-Management und hebt sie in der Ebene hervor.

Um es in Aktion zu sehen, können Sie jede Sprachkopie im WKND-Beispielinhalt und wählen Sie die Live Copy-Status -Modus.

Sie finden die MSM-Ebenendefinition (als Referenz) in:

/libs/wcm/msm/content/touch-ui/authoring/editor/js/msm.Layer.js

Codebeispiel

Dies ist ein Beispielpaket, das zeigt, wie eine Ebene (Modus) für die MSM-Ansicht erstellt wird.

Den Code dieser Seite finden Sie unter GitHub.

Neue Auswahlkategorie zum Asset-Browser hinzufügen

Der Asset-Browser zeigt Assets verschiedener Typen/Kategorien an (z. B. Bilder und Dokumente). Die Assets können auch anhand dieser Asset-Kategorien gefiltert werden.

Codebeispiel

aem-authoring-extension-assetfinder-flickr ist ein Beispielpaket, das zeigt, wie eine Gruppe zur Asset-Suche hinzugefügt wird. Dieses Beispiel verbindet mit Flickrist der öffentliche Stream und zeigt sie im Seitenbereich an.

Den Code dieser Seite finden Sie unter GitHub.

Ressourcen filtern

Beim Erstellen von Seiten muss der Benutzer häufig aus den Ressourcen in einer Liste auswählen.

Um die Liste in einer angemessenen Größe und auch für den Anwendungsfall relevant zu halten, kann ein Filter in Form eines benutzerdefinierten Prädikats implementiert werden. Wenn z. B. der Benutzer durch die pathbrowser-Granite-Komponente den Pfad zu einer bestimmten Ressource auswählen kann, können die gezeigten Pfade auf folgende Art gefiltert werden:

• Implementieren Sie das benutzerdefinierte Prädikat, indem Sie die Schnittstelle com.day.cq.commons.predicate.AbstractNodePredicate implementieren.
• Geben Sie einen Namen für die Eigenschaft an und verwenden Sie diesen Namen, wenn Sie pathbrowser verwenden.

Weitere Details zum Erstellen einer benutzerdefinierten Eigenschaft finden Sie in diesem Artikel.

Hinzufügen einer neuen Aktion zu einer Komponenten-Symbolleiste

Jede Komponente verfügt in der Regel über eine Symbolleiste, die Zugriff auf eine Reihe von Aktionen bietet, die für diese Komponente durchgeführt werden können.

Codebeispiel

aem-authoring-extension-toolbar-screenshot ist ein Beispielpaket, das die Erstellung einer benutzerdefinierten Symbolleistenaktion zum Rendern von Komponenten demonstriert.

Den Code dieser Seite finden Sie unter GitHub.

Neuen Editor für Bearbeitung im Kontext hinzufügen

Standard-Editor für Bearbeitung im Kontext

Bei der Standardinstallation von AEM:

1. /libs/cq/gui/components/authoring/editors/clientlibs/core/js/editors/editorExample.js enthält Definitionen der verschiedenen verfügbaren Editoren.

2. Es besteht eine Verbindung zwischen dem Editor und jedem Ressourcentyp (wie in der Komponente), der ihn verwenden kann:

   • cq:inplaceEditing

     Beispiel:

     • /libs/foundation/components/text/cq:editConfig

     • /libs/foundation/components/image/cq:editConfig

       • property: editorType

         Definiert den Typ des Inline-Editors, der verwendet wird, wenn die Bearbeitung im Kontext für diese Komponente ausgelöst wird. Beispiel: text, textimage, image, title.

3. Zusätzliche Konfigurationsdetails des Editors können mit einer config Knoten, der Konfigurationen enthält, und ein plugin -Knoten, der die erforderlichen Details zur Plug-in-Konfiguration enthält.

Das folgende Beispiel zeigt die Definition von Seitenverhältnissen für das Bildbeschneidungs-Plug-in der image-Komponente.

   <cq:inplaceEditing
           jcr:primaryType="cq:InplaceEditingConfig"
           active="{Boolean}true"
           editorType="image">
           <config jcr:primaryType="nt:unstructured">
               <plugins jcr:primaryType="nt:unstructured">
                   <crop jcr:primaryType="nt:unstructured">
                       <aspectRatios jcr:primaryType="nt:unstructured">
                           <_x0031_6-10
                               jcr:primaryType="nt:unstructured"
                               name="16 : 10"
                               ratio="0.625"/>
                       </aspectRatios>
                   </crop>
               </plugins>
           </config>
   </cq:inplaceEditing>

Erstellen eines neuen Editors für Bearbeitung im Kontext

So erstellen Sie einen neuen Editor für Bearbeitung im Kontext (innerhalb Ihrer clientlib):

1. Implementierung:

   • setUp
   • tearDown

2. Registrieren Sie den Editor (einschließlich des Konstruktors):

   • editor.register

3. Stellen Sie die Verbindung zwischen dem Editor und jedem Ressourcentyp (wie in der Komponente) bereit, der ihn verwenden kann.

Codebeispiel zum Erstellen eines neuen Editors für Bearbeitung im Kontext

aem-authoring-extension-inplace-editor ist ein Beispielpaket, das zeigt, wie ein Editor für die Bearbeitung im Kontext in AEM erstellt wird.

Den Code dieser Seite finden Sie unter GitHub.

Hinzufügen einer neuen Seitenaktion

So fügen Sie der Seitensymbolleiste eine neue Seitenaktion hinzu, z. B. eine Zurück zu Sites Aktion (Konsole).

Codebeispiel

aem-authoring-extension-header-backtosites ist ein Beispielpaket, das die Erstellung einer benutzerdefinierten Kopfzeilenleistenaktion demonstriert, mit der der Benutzer zurück zur Sites-Konsole springt.

Den Code dieser Seite finden Sie unter GitHub.

Anpassen des Aktivierungsanfrage-Workflows

Der vorkonfigurierte Workflow, Aktivierungsanfrage:

• Wird automatisch im entsprechenden Menü angezeigt, wenn ein Inhaltsautor nicht über die entsprechenden Replikationsrechte verfügt, jedoch eine Mitgliedschaft von DAM-Benutzern und Autoren hat.

• Andernfalls wird nichts angezeigt, da die Replikationsrechte entfernt wurden.

Um bei dieser Aktivierung ein benutzerdefiniertes Verhalten zu erzielen, können Sie die Aktivierungsanfrage workflow:

1. Überlagern Sie in /apps den Sites-Assistenten /libs/wcm/core/content/common/managepublicationwizard

   • Dadurch wird die folgende gemeinsame Instanz überlagert /libs/cq/gui/content/common/managepublicationwizard.

2. Aktualisieren Sie das Workflow-Modell und je nach Bedarf relevante Konfigurationen/Skripte.

3. Entfernen Sie die Berechtigung zum replicate Aktion aller entsprechenden Benutzer für alle relevanten Seiten. Damit dieser Workflow als Standardaktion ausgelöst wird, wenn ein Benutzer eine Seite veröffentlicht (oder repliziert).