Anpassung des Seiten-Authorings customizing-page-authoring
AEM bietet verschiedene Mechanismen, mit denen Sie die Seitenbearbeitungsfunktion (und die Konsolen) Ihrer Authoring-Instanz.
-
Clientbibliotheken
Mit Clientbibliotheken können Sie die Standardimplementierung um neue Funktionen erweitern und gleichzeitig Standardfunktionen, -objekte und -methoden wiederverwenden. Bei der Anpassung können Sie unter
/apps.
Ihre eigene Clientbibliothek erstellen. Die neue Clientbibliothek muss:- die Authoring-clientlib
cq.authoring.editor.sites.page
als Abhängigkeit aufweisen - der entsprechenden
cq.authoring.editor.sites.page.hook
-Kategorie angehören
- die Authoring-clientlib
-
Überlagerungen
Überlagerungen basieren auf Knotendefinitionen und ermöglichen es Ihnen, Standardfunktionen (in
/libs
) mit Ihren eigenen benutzerdefinierten Funktionen (in/apps
) zu überlagern. Wenn Sie eine Überlagerung erstellen, ist keine 1:1-Kopie des Originals erforderlich, da die Sling-Ressourcenzusammenführung das Vererben zulässt.
Diese können auf viele Arten verwendet werden, um die Seitenbearbeitungsfunktion in Ihrer AEM-Instanz zu erweitern. Eine Auswahl wird im Folgenden (auf hoher Ebene) behandelt.
- Verwenden und Erstellen clientlibs.
- Verwenden und Erstellen Overlays.
- Granite
- Struktur der Touch-optimierten Benutzeroberfläche von AEM für Details zu den strukturellen Bereichen, die beim Seiten-Authoring verwendet werden.
/libs
vornehmen,/libs
überschrieben wird, wenn Sie die Instanz das nächste Mal aktualisieren. (Außerdem kann der Inhalt auch durch Anwenden von Hotfixes oder Feature Packs überschrieben werden.)- Erstellen Sie das erforderliche Element (d. h., wie unter
/libs
) unter/apps
neu. - Nehmen Sie die gewünschten Änderungen in
/apps
vor.
Neue Ebene hinzufügen (Modus) add-new-layer-mode
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. Die Standardschichten sind: Bearbeiten, Vorschau, Anmerkungen, Entwickler und Targeting.
Ebenenbeispiel: Live Copy-Status layer-example-live-copy-status
Eine standardmäßige AEM-Instanz stellt die MSM-Ebene bereit. Auf Daten im Zusammenhang mit Multi-Site-Management und hebt sie in der Ebene hervor.
Um sie im Einsatz zu sehen, bearbeiten Sie eine beliebige We.Retail-Sprachkopie-Seite (oder eine beliebige andere Live Copy-Seite) und wählen Sie den Modus Live Copy-Status aus.
Sie finden die MSM-Ebenendefinition (als Referenz) in:
/libs/wcm/msm/content/touch-ui/authoring/editor/js/msm.Layer.js
Codebeispiel code-sample
Dies ist ein Beispielpaket, das zeigt, wie eine neue Ebene (Modus) erstellt wird, die eine neue Ebene für die MSM-Ansicht ist.
CODE FÜR GITHUB
Den Code dieser Seite finden Sie auf GitHub.
- Öffnen Sie das Projekt aem-authoring-new-layer-mode in GitHub
- Laden Sie das Projekt als ZIP-Datei herunter.
Neue Auswahlkategorie zum Asset-Browser hinzufügen add-new-selection-category-to-asset-browser
Der Asset-Browser zeigt Assets verschiedener Typen/Kategorien (z. B. Bild, Dokumente usw.) an. Die Assets können auch anhand dieser Asset-Kategorien gefiltert werden.
Codebeispiel code-sample-1
aem-authoring-extension-assetfinder-flickr
ist ein Beispielpaket, das das Hinzufügen einer neuen Gruppe zur Asset-Suche demonstriert. Dieses Beispiel verbindet sich mit dem öffentlichen Stream von Flickr und zeigt ihn im Seitenbereich.
CODE FÜR GITHUB
Den Code dieser Seite finden Sie auf GitHub.
- Öffnen Sie das Projekt aem-authoring-extension-assetfinder-flickr in GitHub
- Laden Sie das Projekt als ZIP-Datei herunter.
Ressourcen filtern filtering-resources
Beim Erstellen von Seiten muss der Benutzer häufig aus Ressourcen (z. B. Seiten, Komponenten, Assets usw.) auswählen. Dies kann in Form einer Liste erfolgen, aus der der Autor beispielsweise ein Element auswählen muss.
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.
com.day.cq.commons.predicate.AbstractNodePredicate
funktioniert auch in der klassischen Benutzeroberfläche.Hinzufügen einer neuen Aktion zur Komponentensymbolleiste add-new-action-to-a-component-toolbar
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 code-sample-2
aem-authoring-extension-toolbar-screenshot
ist ein Beispielpaket, das die Erstellung einer benutzerdefinierten Symbolleistenaktion zum Rendern von Komponenten demonstriert.
CODE FÜR GITHUB
Den Code dieser Seite finden Sie auf GitHub.
- Öffnen Sie das Projekt aem-authoring-extension-toolbar-screenshot in GitHub
- Laden Sie das Projekt als ZIP-Datei herunter.
Neuen Editor für Bearbeitung im Kontext hinzufügen add-new-in-place-editor
Standard-Editor für Bearbeitung im Kontext standard-in-place-editor
Bei der Standardinstallation von AEM:
-
/libs/cq/gui/components/authoring/editors/clientlibs/core/js/editors/editorExample.js
Enthält Definitionen der verschiedenen verfügbaren Editoren.
-
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 die Art des Inline-Editors, der verwendet wird, wenn die Bearbeitung im Kontext für diese Komponente ausgelöst wird, z. B.
text
,textimage
,image
,title
.
-
-
-
-
Weitere Einstellungen des Editors können mit einem
config
-Knoten, der Konfigurationen enthält, sowie einem weiterenplugin
-Knoten mit notwendigen Plug-in-Konfigurationsdetails konfiguriert werden.Das folgende Beispiel zeigt die Definition von Seitenverhältnissen für das Bildbeschneidungs-Plug-in der image-Komponente. Beachten Sie, dass aufgrund der Möglichkeit von begrenzten Bildschirmgrößen die Beschneidungsverhältnisse in den Vollbild-Editor verlegt wurden und nur dort sichtbar sind.
code language-xml <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>
note caution CAUTION Beachten Sie, dass Beschneidungsverhältnisse, die durch die Eigenschaft ratio
definiert werden, in AEM als Höhe/Breite definiert sind. Dies unterscheidet sich von der herkömmlichen Definition der Breite/Höhe und ist auf Kompatibilität mit Altsystemen zurückzuführen. Die Benutzer, die die Seite erstellen, bemerken keinen Unterschied, vorausgesetzt, dass Sie die Eigenschaftname
klar definieren, da diese auf der Benutzeroberfläche angezeigt wird.
Erstellen eines neuen Editors für Bearbeitung im Kontext creating-a-new-in-place-editor
So erstellen Sie einen neuen Editor für Bearbeitung im Kontext (innerhalb Ihrer clientlib):
/libs/cq/gui/components/authoring/editors/clientlibs/core/js/editors/editorExample.js
-
Implementierung:
setUp
tearDown
-
Registrieren Sie den Editor (einschließlich des Konstruktors):
editor.register
-
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 code-sample-for-creating-a-new-in-place-editor
aem-authoring-extension-inplace-editor
ist ein Beispielpaket, das die Erstellung eines neuen Editors für Bearbeitung im Kontext in AEM demonstriert.
CODE FÜR GITHUB
Den Code dieser Seite finden Sie auf GitHub.
- Öffnen Sie das Projekt aem-authoring-extension-inplace-editor in GitHub
- Laden Sie das Projekt als ZIP-Datei herunter.
Konfigurieren mehrerer Editierender für Bearbeitung im Kontext configuring-multiple-in-place-editors
Es ist möglich, eine Komponente so zu konfigurieren, dass sie über mehrere Editoren für Bearbeitung im Kontext verfügt. Wenn mehrere Editoren für Bearbeitung im Kontext konfiguriert sind, können Sie den entsprechenden Inhalt auswählen und den entsprechenden Editor öffnen. In der Dokumentation zur Konfigurieren mehrerer Editoren für Bearbeitung im Kontext finden Sie weitere Informationen.
Hinzufügen einer neuen Seitenaktion add-a-new-page-action
So fügen Sie der Seitensymbolleiste eine neue Seitenaktion hinzu, z. B. eine Zurück zu Sites Aktion (Konsole).
Codebeispiel code-sample-3
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.
CODE FÜR GITHUB
Den Code dieser Seite finden Sie auf GitHub.
- Öffnen Sie das Projekt aem-authoring-extension-header-backtosites in GitHub
- Laden Sie das Projekt als ZIP-Datei herunter.
Anpassen des Aktivierungsanfrage-Workflows customizing-the-request-for-activation-workflow
Der vordefinierte Workflow, Aktivierungsanfrage wird automatisch ausgelöst, wenn ein Inhaltsautor nicht über die entsprechenden Replikationsrechte verfügt.
Um das Verhalten bei dieser Aktivierung anzupassen, können Sie den Aktivierungsanfrage-Workflow überlagern:
-
Überlagern Sie in
/apps
den Sites-Assistenten:/libs/wcm/core/content/common/managepublicationwizard
note note NOTE Dadurch wird die folgende gemeinsame Instanz überlagert: /libs/cq/gui/content/common/managepublicationwizard
-
Aktualisieren Sie das Workflow-Modell und je nach Bedarf relevante Konfigurationen/Skripte.
-
Entziehen Sie allen entsprechenden Benutzern für alle relevanten Seiten das Recht zur
replicate
-Aktion, damit dieser Workflow standardmäßig ausgelöst wird, wenn ein Benutzer versucht, eine Seite zu veröffentlichen (oder zu replizieren).