Paginaontwerp aanpassen customizing-page-authoring
Adobe Experience Manager (AEM) verstrekt diverse mechanismen om u de pagina auteursfunctionaliteit (en de consoles) van uw auteursinstantie te laten aanpassen.
-
Clientlibs
Clientlibs laten u de standaardimplementatie uitbreiden om nieuwe functionaliteit te realiseren, terwijl het hergebruiken van de standaardfuncties, de voorwerpen, en de methodes. Bij het aanpassen kunt u uw eigen clientlib maken onder
/apps.
De nieuwe clientlib moet:- zijn afhankelijk van de client-client voor het schrijven van programmacode
cq.authoring.editor.sites.page
- deel uitmaken van de juiste categorie
cq.authoring.editor.sites.page.hook
- zijn afhankelijk van de client-client voor het schrijven van programmacode
-
Bedekkingen
Bedekkingen zijn gebaseerd op knooppuntdefinities en u kunt de standaardfunctionaliteit (in
/libs
) bedekken met uw eigen aangepaste functionaliteit (in/apps
). Wanneer het creëren van een bekleding wordt een 1:1 exemplaar van origineel niet vereist, aangezien de dalende middelfusievoor overerving toestaat.
Deze kunnen op verschillende manieren worden gebruikt om de functionaliteit voor het schrijven van pagina's in uw AEM uit te breiden. Een selectie wordt hieronder behandeld (op een hoog niveau).
- Het gebruiken van en het creëren van clientlibs.
- Het gebruiken van en het creëren van bekledingen.
- Graniet
- Structuur van de AEM aanraking-Toegelaten UIvoor details van de structurele gebieden die voor paginaontwerp worden gebruikt.
/libs
weg./libs
wordt overschreven, de volgende keer dat u een upgrade uitvoert van uw exemplaar (en dat u deze mogelijk overschrijft wanneer u een hotfix- of functiepakket toepast).- Het vereiste item opnieuw maken (dat wil zeggen, zoals het in
/libs
staat) onder/apps
- Breng eventuele wijzigingen aan binnen
/apps
Nieuwe laag toevoegen (modus) add-new-layer-mode
Wanneer u een pagina uitgeeft, zijn er diverse beschikbare wijzen. Deze wijzen worden uitgevoerd gebruikend lagen. Hiermee hebt u toegang tot verschillende typen functionaliteit voor dezelfde pagina-inhoud. De standaardlagen zijn: bewerken, voorvertonen, notities aanbrengen, ontwikkelaars en doelwitten.
Voorbeeld van laag: status van actieve kopie layer-example-live-copy-status
Een standaard AEM instantie verstrekt de laag MSM. Dit heeft toegang tot gegevens met betrekking tot multisite beheeren benadrukt het in de laag.
Om het in actie te zien, kunt u om het even welke 🔗 pagina van het wij.Retail taalexemplaar uitgeven (of een andere levende exemplaarpagina) en de Levende wijze van de Status van het Exemplaar selecteren.
U kunt de MSM laagdefinitie (voor verwijzing) vinden in:
/libs/wcm/msm/content/touch-ui/authoring/editor/js/msm.Layer.js
Codevoorbeeld code-sample
Dit is een steekproefpakket dat toont hoe te om een laag (wijze) tot stand te brengen, die een nieuwe laag voor mening MSM is.
CODE VOOR GITHUB
U kunt de code van deze pagina op GitHub vinden
- open aem-authoring-new-layer-mode project op GitHub
- Download het project als een dossier van het PIT
Nieuwe selectiecategorie toevoegen aan de middelenbrowser add-new-selection-category-to-asset-browser
In de middelenbrowser worden elementen van verschillende typen/categorieën weergegeven (bijvoorbeeld afbeeldingen en documenten). De activa kunnen ook door deze activacategorieën worden gefiltreerd.
Codevoorbeeld code-sample-1
aem-authoring-extension-assetfinder-flickr
is een voorbeeldpakket dat aangeeft hoe u een groep aan de elementenzoeker kunt toevoegen. Dit voorbeeld verbindt met de openbare stroom van Flickren toont hen in het zijpaneel.
CODE VOOR GITHUB
U kunt de code van deze pagina op GitHub vinden
- open aem-authoring-extension-assetfinder-flickr project op GitHub
- Download het project als een dossier van het PIT
Bronnen filteren filtering-resources
Bij het ontwerpen van pagina's moet de gebruiker vaak bronnen selecteren (bijvoorbeeld pagina's, componenten en elementen). Dit kan bijvoorbeeld de vorm aannemen van een lijst waaruit de auteur een item moet kiezen.
Om de lijst tot een redelijke grootte en ook relevant voor het gebruiksgeval te houden, kan een filter in de vorm van een douanevoorspelling worden uitgevoerd. Bijvoorbeeld, als de pathbrowser
granietcomponent wordt gebruikt om de gebruiker toe te staan om de weg aan een bepaald middel te selecteren, kunnen de voorgestelde wegen op de volgende manier worden gefiltreerd:
- Implementeer de aangepaste voorspelling door de
com.day.cq.commons.predicate.AbstractNodePredicate
-interface te implementeren. - Geef een naam voor de voorspelling op en verwijs die naam wanneer u de voorspelling van
pathbrowser
gebruikt.
Voor verder detail bij het creëren van een douane predikaat, zie Uitvoerend een Evaluator van de Predicate van de Douane voor de Bouwer van de Vraag.
com.day.cq.commons.predicate.AbstractNodePredicate
-interface werkt ook in de klassieke UI.Nieuwe handeling toevoegen aan werkbalk Component add-new-action-to-a-component-toolbar
Elke component (gewoonlijk) heeft een werkbalk die toegang biedt tot een reeks handelingen die op die component kunnen worden uitgevoerd.
Codevoorbeeld code-sample-2
aem-authoring-extension-toolbar-screenshot
is een voorbeeldpakket dat aangeeft hoe u een aangepaste werkbalkactie kunt maken om componenten te renderen.
CODE VOOR GITHUB
U kunt de code van deze pagina op GitHub vinden
- open aem-auteurs-uitbreiding-toolbar-screenshot project op GitHub
- Download het project als een dossier van het PIT
Nieuwe plaatseditor toevoegen add-new-in-place-editor
Standaardeditor standard-in-place-editor
In een standaard AEM-installatie:
-
/libs/cq/gui/components/authoring/editors/clientlibs/core/js/editors/editorExample.js
Bevat definities van de verschillende beschikbare editors.
-
Er is een verbinding tussen de redacteur en elk middeltype (zoals in component) dat het kan gebruiken:
-
cq:inplaceEditing
bijvoorbeeld:
-
/libs/foundation/components/text/cq:editConfig
-
/libs/foundation/components/image/cq:editConfig
-
eigenschap:
editorType
Definieert het type inline-editor dat wordt gebruikt wanneer de bewerking op plaats wordt geactiveerd voor die component, bijvoorbeeld
text
,textimage
,image
,title
.
-
-
-
-
Aanvullende configuratiedetails van de editor kunnen worden geconfigureerd met een
config
-knooppunt met configuraties en eenplugin
-knooppunt voor de benodigde insteekconfiguratiedetails.Hieronder ziet u een voorbeeld van het definiëren van hoogte-breedteverhoudingen voor de uitsnijdplug-in van de afbeeldingscomponent. Vanwege de beperkte schermgrootte zijn de hoogte-breedteverhoudingen voor uitsnijden verplaatst naar de volledige schermeditor en kunnen deze alleen daar worden weergegeven.
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 AEM gewassenverhoudingen, zoals die door het ratio
bezit worden geplaatst, worden bepaald als hoogte/breedte. Dit verschilt van de conventionele definitie van breedte/hoogte en wordt gedaan om oude compatibiliteitsredenen. De ontwerpgebruikers zijn zich niet bewust van enig verschil op voorwaarde dat u de eigenschapname
duidelijk definieert, aangezien dit is wat wordt weergegeven in de gebruikersinterface.
Een nieuwe plaatseditor maken creating-a-new-in-place-editor
Om een nieuwe op zijn plaats redacteur (binnen uw clientlib) uit te voeren:
/libs/cq/gui/components/authoring/editors/clientlibs/core/js/editors/editorExample.js
-
Implementeren:
setUp
tearDown
-
Registreer de editor (inclusief de constructor):
editor.register
-
Verstrek de verbinding tussen de redacteur en elk middeltype (zoals in component) dat het kan gebruiken.
Codevoorbeeld voor het maken van een nieuwe plaatseditor code-sample-for-creating-a-new-in-place-editor
aem-authoring-extension-inplace-editor
is een voorbeeldpakket waarin wordt getoond hoe u een lokale editor in AEM kunt maken.
CODE VOOR GITHUB
U kunt de code van deze pagina op GitHub vinden
- open aem-authoring-extension-inplace-redacteursproject op GitHub
- Download het project als een dossier van het PIT
Meerdere lokale editors configureren configuring-multiple-in-place-editors
Het is mogelijk om een component te vormen zodat het veelvoudige op zijn plaats redacteurs heeft. Wanneer er meerdere editors op locatie zijn geconfigureerd, kunt u de juiste inhoud selecteren en de juiste editor openen. Zie het Vormen Veelvoudige In-Place documentatie van Editorsvoor meer informatie.
Handeling Nieuwe pagina toevoegen add-a-new-page-action
Om een nieuwe paginaactie aan de paginatoolbar toe te voegen, bijvoorbeeld, a terug naar Plaatsen (console) actie.
Codevoorbeeld code-sample-3
aem-authoring-extension-header-backtosites
is een voorbeeldpakket waarin wordt getoond hoe u een aangepaste actie voor de koptekstbalk kunt maken om terug te gaan naar de Sites-console.
CODE VOOR GITHUB
U kunt de code van deze pagina op GitHub vinden
- open aem-authoring-extension-header-backtosites project op GitHub
- Download het project als een dossier van het PIT
De workflow voor het aanvragen van activering aanpassen customizing-the-request-for-activation-workflow
Het uit-van-de-dooswerkschema, Verzoek om Activering:
-
Zal automatisch op het aangewezen menu verschijnen wanneer een inhoudsauteur niet de aangewezen replicatierechten heeft, maar heeft lidmaatschap van DAM-Gebruikers en Auteurs.
-
Anders wordt er niets weergegeven, omdat de replicatierechten zijn verwijderd.
Om aangepast gedrag op dergelijke activering te hebben, kunt u het Verzoek om het werkschema van de Activering bedekken:
-
In
/apps
bedekking de 2} tovenaar van Plaatsen {:/libs/wcm/core/content/common/managepublicationwizard
note note NOTE Dit zelf, treedt het gemeenschappelijke geval van met voeten: /libs/cq/gui/content/common/managepublicationwizard
-
Werk het werkschemamodelen verwante configuraties/manuscripten zoals vereist bij.
-
Verwijder het recht op de
replicate
actievan alle aangewezen gebruikers voor alle relevante pagina's; om dit werkschema als standaardactie teweeggebracht te hebben wanneer om het even welke gebruikers proberen om een pagina te publiceren (of te herhalen).