Anpassa sidredigering

FÖRSIKTIGHET

I det här dokumentet beskrivs hur du anpassar sidredigering i det moderna, pekaktiverade användargränssnittet och det gäller inte det klassiska användargränssnittet.

AEM innehåller olika mekanismer som gör att du kan anpassa sidredigeringsfunktionen (och konsolerna) för redigeringsinstansen.

  • Clientlibs

    Med Clientlibs kan du utöka standardimplementeringen för att få nya funktioner, samtidigt som du återanvänder standardfunktioner, objekt och standardmetoder. När du anpassar kan du skapa ett eget klientlib under /apps. Det nya klientlib måste:

    • är beroende av redigeringsklientlib cq.authoring.editor.sites.page
    • ingå i lämplig cq.authoring.editor.sites.page.hook-kategori
  • Övertäckningar

    Övertäckningar baseras på noddefinitioner och gör att du kan täcka över standardfunktionerna (i /libs) med din egen anpassade funktion (i /apps). När du skapar en övertäckning krävs inte en 1:1-kopia av originalet, eftersom sling-resurskonfusion tillåter arv.

OBSERVERA

Mer information finns i JS-dokumentationsuppsättningen.

De kan användas på många sätt för att utöka sidredigeringsfunktionen i AEM. En markering beskrivs nedan (på en hög nivå).

OBSERVERA

Mer information finns i:

Det här avsnittet behandlas också i AEM Gems-sessionen - Anpassning av användargränssnittet för AEM 6.0.

FÖRSIKTIGHET

Du får inte ändra något i /libs-sökvägen.

Detta beror på att innehållet i /libs skrivs över nästa gång du uppgraderar din instans (och kan mycket väl skrivas över när du använder en snabbkorrigering eller ett funktionspaket).

Den rekommenderade metoden för konfiguration och andra ändringar är:

  1. Återskapa önskat objekt (t.ex. som det finns i /libs) under /apps
  2. Gör ändringar i /apps

Lägg till nytt lager (läge)

När du redigerar en sida finns det olika lägen tillgängliga. Dessa lägen implementeras med lager. Dessa ger åtkomst till olika typer av funktioner för samma sidinnehåll. Standardlagren är: redigera, förhandsgranska, kommentera, utveckla och målinrikta.

Exempel på lager: Live Copy-status

En AEM standardinstans innehåller MSM-lagret. Detta ger åtkomst till data som är relaterade till hantering av flera platser och markerar dem i lagret.

För att se hur det fungerar kan du redigera en webbsida (eller någon annan live-kopia) och välja läget Live Copy Status.

MSM-lagerdefinitionen (som referens) finns i:

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

Kodexempel

Detta är ett exempelpaket som visar hur du skapar ett nytt lager (läge), som är ett nytt lager för MSM-vyn.

KOD PÅ GITHUB

Koden för den här sidan finns på GitHub

Lägg till ny markeringskategori i resursläsaren

Resursläsaren visar resurser av olika typer/kategorier (t.ex. bilder, dokument osv.). Resurserna kan också filtreras efter dessa tillgångskategorier.

Kodexempel

aem-authoring-extension-assetfinder-flickr är ett exempelpaket som visar hur du lägger till en ny grupp i tillgångssökaren. Det här exemplet ansluter till den allmänna dataströmmen för Flickr och visar dem på sidopanelen.

KOD PÅ GITHUB

Koden för den här sidan finns på GitHub

Filtreringsresurser

När användaren redigerar sidor måste han eller hon ofta välja bland resurser (t.ex. sidor, komponenter, resurser osv.). Detta kan vara en lista som författaren till exempel måste välja ett objekt från.

För att hålla listan i en rimlig storlek och även relevant för användningsfallet kan ett filter implementeras i form av ett anpassat predikat. Om till exempel pathbrowser Granite-komponenten används för att låta användaren välja sökvägen till en viss resurs, kan sökvägarna som visas filtreras på följande sätt:

Mer information om hur du skapar ett anpassat predikat finns i den här artikeln.

OBSERVERA

Implementering av ett anpassat predikat genom implementering av gränssnittet com.day.cq.commons.predicate.AbstractNodePredicate fungerar även i det klassiska användargränssnittet.

I den här kunskapsbasartikeln finns ett exempel på hur du implementerar ett anpassat predikat i det klassiska användargränssnittet.

Lägg till ny åtgärd i ett komponentverktygsfält

Varje komponent (vanligtvis) har ett verktygsfält som ger tillgång till en rad åtgärder som kan vidtas för den komponenten.

Kodexempel

aem-authoring-extension-toolbar-screenshot är ett exempelpaket som visar hur du skapar en anpassad verktygsfältåtgärd för att återge komponenter.

KOD PÅ GITHUB

Koden för den här sidan finns på GitHub

Lägg till ny lokal redigerare

Standardredigerare på plats

I en vanlig AEM-installation:

  1. /libs/cq/gui/components/authoring/editors/clientlibs/core/js/editors/editorExample.js

    Innehåller definitioner av de olika redigeringsprogrammen som är tillgängliga.

  2. Det finns en anslutning mellan redigeraren och varje resurstyp (som i komponenten) som kan använda den:

    • cq:inplaceEditing

      till exempel:

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

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

        • egenskap: editorType

          Definierar vilken typ av infogad redigerare som ska användas när redigeringen på plats aktiveras för den komponenten. t.ex. text, textimage, image, title.

  3. Ytterligare konfigurationsinformation om redigeraren kan konfigureras med en config-nod som innehåller konfigurationer samt en annan plugin-nod som innehåller nödvändig konfigurationsinformation för plugin-programmet.

    Följande är ett exempel på hur du definierar bildproportioner för bildbeskärningsplugin-programmet för bildkomponenten. Observera att beskärningsproportionerna flyttades till helskärmsredigeraren på grund av risken för mycket begränsad skärmstorlek och att de bara kan ses där.

    <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>
    
    FÖRSIKTIGHET

    Observera att i AEM beskärningsproportioner, som anges av egenskapen ratio, definieras som height/width. Detta skiljer sig från den vanliga definitionen av bredd/höjd och görs av äldre kompatibilitetsskäl. Redigeringsanvändarna kommer inte att vara medvetna om några skillnader förutsatt att du definierar egenskapen name tydligt eftersom detta visas i användargränssnittet.

Skapa en ny lokal redigerare

Så här implementerar du en ny redigerare på plats (i klientlib):

OBSERVERA

Se till exempel:
/libs/cq/gui/components/authoring/editors/clientlibs/core/js/editors/editorExample.js

  1. Implementera:

    • setUp
    • tearDown
  2. Registrera redigeraren (inkluderar konstruktorn):

    • editor.register
  3. Ange anslutningen mellan redigeraren och alla resurstyper (som i komponenten) som kan använda den.

Kodexempel för att skapa en ny lokal redigerare

aem-authoring-extension-inplace-editor är ett exempelpaket som visar hur du skapar en ny redigerare på plats i AEM.

KOD PÅ GITHUB

Koden för den här sidan finns på GitHub

Konfigurera flera redigerare på plats

Det går att konfigurera en komponent så att den har flera redigerare på plats. När flera redigerare på plats har konfigurerats kan du välja rätt innehåll och öppna rätt redigerare. Mer information finns i Configuring Multiple In-Place Editors-dokumentationen.

Lägg till en ny sidåtgärd

Om du vill lägga till en ny sidåtgärd i sidverktygsfältet, till exempel en Gå tillbaka till platser (konsol)-åtgärd.

Kodexempel

aem-authoring-extension-header-backtosites är ett exempelpaket som visar hur du skapar en anpassad åtgärd i sidhuvudsfältet för att hoppa tillbaka till webbplatskonsolen.

KOD PÅ GITHUB

Koden för den här sidan finns på GitHub

Anpassa arbetsflödet för begäran om aktivering

Det färdiga arbetsflödet, Begär aktivering:

  • Visas automatiskt på rätt meny när en innehållsförfattare inte har rätt replikeringsbehörighet, men inte har medlemskap i DAM-användare och författare.

  • I annat fall visas ingenting eftersom replikeringsrättigheterna har tagits bort.

Om du vill ha ett anpassat beteende vid en sådan aktivering kan du täcka över arbetsflödet Begär aktivering:

  1. I /apps-övertäckningen Platser-guiden:

    /libs/wcm/core/content/common/managepublicationwizard

    OBSERVERA

    Detta åsidosätter den vanliga förekomsten av:

    /libs/cq/gui/content/common/managepublicationwizard

  2. Uppdatera arbetsflödesmodellen och relaterade konfigurationer/skript efter behov.

  3. Ta bort rättigheten till replicate-åtgärden från alla lämpliga användare för alla relevanta sidor, om du vill att det här arbetsflödet ska utlösas som en standardåtgärd när någon av användarna försöker publicera (eller replikera) en sida.

På denna sida