Editor van element uitbreiden extending-asset-editor

De Asset Editor is de pagina die wordt geopend wanneer op een element wordt geklikt dat via Asset Share wordt gevonden, zodat de gebruiker deze aspecten van het element kan bewerken, zoals metagegevens, miniaturen, titels en tags.

De configuratie van de redacteur die de vooraf bepaalde het uitgeven componenten gebruikt wordt behandeld in Creërend en Vormend een Pagina van de Redacteur van Activa.

Naast het gebruik van reeds bestaande editorcomponenten, kunnen Adobe Experience Manager ontwikkelaars ook hun eigen componenten tot stand brengen.

Een sjabloon voor de Asset Editor maken creating-an-asset-editor-template

De volgende voorbeeldpagina's worden opgenomen in Geometrixx:

Clientlib configureren configuring-clientlib

Assets -componenten gebruiken een extensie van de WCM-bewerkingsclient. De clientlibs worden meestal geladen in init.jsp .

Vergeleken met het standaard clientlib laden (in core's init.jsp), moet een Assets -sjabloon het volgende hebben:

In de meeste gevallen moet het kopiëren van het bestaande voorbeeld init.jsp (/apps/geometrixx/components/asseteditor/init.jsp) aan deze vereisten voldoen.

JS-handelingen configureren configuring-js-actions

Voor sommige Assets -componenten zijn JS-functies vereist die in component.js zijn gedefinieerd. Kopieer dit bestand naar de map met componenten en koppel deze.

<script type="text/javascript" src="<%= component.getPath() %>/component.js"></script>

Het voorbeeld laadt deze JavaScript-bron in head.jsp (/apps/geometrixx/components/asseteditor/head.jsp).

Aanvullende stijlbladen additional-style-sheets

Sommige Assets -componenten gebruiken de widget-bibliotheek. Om correct in de inhoudscontext te worden teruggegeven, moet een extra stijlblad worden geladen. Voor de component Handeling tag is nog een component vereist.

<link href="/etc/designs/geometrixx/ui.widgets.css" rel="stylesheet" type="text/css">

Stijlblad Geometrixx geometrixx-style-sheet

Voor de voorbeeldpaginacomponenten is het vereist dat alle kiezers beginnen met .asseteditor van static.css (/etc/designs/geometrixx/static.css). Tips en trucs: kopieer alle .asseteditor kiezers naar de stijlpagina en pas de regels naar wens aan.

FormChooser: Aanpassingen voor uiteindelijk geladen bronnen formchooser-adjustments-for-eventually-loaded-resources

De Asset Editor gebruikt de Formulierkiezer, waarmee u bronnen - in dit geval elementen - op dezelfde formulierpagina kunt bewerken door gewoon een formulierkiezer en het pad van het formulier toe te voegen aan de URL van het element.

Bijvoorbeeld:

De voorbeeldhandgrepen in head.jsp (/apps/geometrixx/components/asseteditor/head.jsp) doen het volgende:

 List<Resource> resources = FormsHelper.getFormEditResources(slingRequest);
    if (resources != null) {
        if (resources.size() == 1) {
            // single resource
            FormsHelper.setFormLoadResource(slingRequest, resources.get(0));
        } else if (resources.size() > 1) {
            // multiple resources
            // not supported by CQ 5.3
        }
    }
    Resource loadResource = (Resource) request.getAttribute("cq.form.loadresource");
    String title;
    if (loadResource != null) {
        // an asset is loaded: disable WCM
        WCMMode.DISABLED.toRequest(request);

        String path = loadResource.getPath();
        Asset asset = loadResource.adaptTo(Asset.class);
        try {
            // it might happen that the adobe xmp lib creates an array
            Object titleObj = asset.getMetadata("dc:title");
            if (titleObj instanceof Object[]) {
                Object[] titleArray = (Object[]) titleObj;
                title = (titleArray.length > 0) ? titleArray[0].toString() : "";
            } else {
                title = titleObj.toString();
            }
        }
        catch (NullPointerException e) {
            title = path.substring(path.lastIndexOf("/") + 1);
        }
    }
    else {
        title = currentPage.getTitle() == null ? currentPage.getName() : currentPage.getTitle();
    }

Gebruik in het HTML-deel de voorafgaande titelset (element of paginatitel):

<title><%= title %></title>

Een eenvoudige component voor een formulierveld maken creating-a-simple-form-field-component

In dit voorbeeld wordt beschreven hoe u een component kunt maken die de metagegevens van een geladen element weergeeft en weergeeft.

Opties voor metagegevens wijzigen modifying-metadata-options

U kunt namespaces beschikbaar in de meta-gegevensvormwijzigen.

De momenteel beschikbare metagegevens worden gedefinieerd in /libs/dam/options/metadata :

De opties kunnen worden overschreven in /apps/dam/options/metadata :