Personalizzazione della console Siti web (interfaccia classica) customizing-the-websites-console-classic-ui

Aggiunta di una colonna personalizzata alla console Siti Web (siteadmin) adding-a-custom-column-to-the-websites-siteadmin-console

La console di amministrazione dei siti Web può essere estesa per visualizzare colonne personalizzate. La console è basata su un oggetto JSON che può essere esteso creando un servizio OSGI che implementa l'interfaccia ListInfoProvider. Tale servizio modifica l’oggetto JSON inviato al client per generare la console.

Questo tutorial dettagliato spiega come visualizzare una nuova colonna nella console di amministrazione dei siti Web implementando l'interfaccia ListInfoProvider. È costituito dai seguenti passaggi:

  1. Creazione del servizio OSGI e distribuzione del bundle che lo contiene nel server AEM.
  2. (facoltativo) Verifica del nuovo servizio tramite l'emissione di una chiamata JSON per richiedere l'oggetto JSON utilizzato per generare la console.
  3. Visualizzazione della nuova colonna tramite l'estensione della struttura dei nodi della console nell'archivio.
NOTE
Questo tutorial può essere utilizzato anche per estendere le seguenti console di amministrazione:
  • la console Digital Assets
  • la console Community

Creazione del servizio OSGI creating-the-osgi-service

L'interfaccia ListInfoProvider definisce due metodi:

  • updateListGlobalInfo, per aggiornare le proprietà globali dell'elenco
  • updateListItemInfo, per aggiornare una singola voce di elenco.

Gli argomenti per entrambi i metodi sono:

  • request, l'oggetto di richiesta HTTP Sling associato,
  • info, l'oggetto JSON da aggiornare, che è rispettivamente l'elenco globale o la voce di elenco corrente,
  • resource, una risorsa Sling.

Di seguito è riportato un esempio di implementazione:

  • Aggiunge una proprietà starred per ogni elemento, ovvero true se il nome della pagina inizia con e, altrimenti false.

  • Aggiunge una proprietà starredCount, che è globale per l'elenco e contiene il numero di elementi dell'elenco di cui è stata eseguita la visualizzazione.

Per creare il servizio OSGI:

  1. In CRXDE Lite crea un bundle.
  2. Aggiungi il codice di esempio seguente.
  3. Crea il bundle.

Il nuovo servizio è operativo.

package com.test;

import com.day.cq.commons.ListInfoProvider;
import com.day.cq.i18n.I18n;
import com.day.cq.wcm.api.Page;
import org.apache.felix.scr.annotations.Component;
import org.apache.felix.scr.annotations.Service;
import org.apache.sling.api.SlingHttpServletRequest;
import org.apache.sling.api.resource.Resource;
import org.apache.sling.commons.json.JSONException;
import org.apache.sling.commons.json.JSONObject;

@Component(metatype = false)
@Service(value = ListInfoProvider.class)
public class StarredListInfoProvider implements ListInfoProvider {

    private int count = 0;

    public void updateListGlobalInfo(SlingHttpServletRequest request, JSONObject info, Resource resource) throws JSONException {
        info.put("starredCount", count);
        count = 0; // reset for next execution
    }

    public void updateListItemInfo(SlingHttpServletRequest request, JSONObject info, Resource resource) throws JSONException {
        Page page = resource.adaptTo(Page.class);
        if (page != null) {
            // Consider starred if page name starts with 'e'
            boolean starred = page.getName().startsWith("e");
            if (starred) {
                count++;
            }
            I18n i18n = new I18n(request);
            info.put("starred", starred ? i18n.get("Yes") : i18n.get("No"));
        }
    }

}
CAUTION
  • L’implementazione deve decidere, in base alla richiesta e/o alla risorsa fornite, se aggiungere o meno le informazioni all’oggetto JSON.

  • Se l'implementazione di ListInfoProvider definisce una proprietà esistente nell'oggetto di risposta, il relativo valore viene sovrascritto da quello fornito.

    È possibile utilizzare classificazione servizio per gestire l'ordine di esecuzione di più implementazioni ListInfoProvider.

Test del nuovo servizio testing-the-new-service

Quando apri la console di amministrazione dei siti web e esplori il sito, il browser emette una chiamata Ajax per ottenere l’oggetto JSON utilizzato per generare la console. Ad esempio, quando si passa alla cartella /content/geometrixx, la seguente richiesta viene inviata al server AEM per creare la console:

https://localhost:4502/content/geometrixx.pages.json?start=0&limit=30&predicate=siteadmin

Per assicurarti che il nuovo servizio sia in esecuzione dopo aver distribuito il bundle che lo contiene:

  1. Puntare il browser al seguente URL:
    https://localhost:4502/content/geometrixx.pages.json?start=0&limit=30&predicate=siteadmin

  2. La risposta deve visualizzare le nuove proprietà come segue:

schermata_shot_2012-02-13at163046

Visualizzazione della nuova colonna displaying-the-new-column

Geometrixx L'ultimo passaggio consiste nell'adattare la struttura dei nodi della console di amministrazione dei siti Web per visualizzare la nuova proprietà per tutte le pagine sovrapponendo /libs/wcm/core/content/siteadmin. Procedere come segue:

  1. In CRXDE Lite creare la struttura dei nodi /apps/wcm/core/content con nodi di tipo sling:Folder per riflettere la struttura /libs/wcm/core/content.

  2. Copiare il nodo /libs/wcm/core/content/siteadmin e incollarlo sotto /apps/wcm/core/content.

  3. Copiare il nodo /apps/wcm/core/content/siteadmin/grid/assets in /apps/wcm/core/content/siteadmin/grid/geometrixx e modificarne le proprietà:

    • Rimuovi testoPagina

    • Imposta pathRegex su /content/geometrixx(/.*)?
      In questo modo la configurazione della griglia viene attivata per tutti i siti Web di Geometrixx.

    • Imposta storeProxySuffix su .pages.json

    • Modificare la proprietà multivalore storeReaderFields e aggiungere il valore starred.

    • Per attivare la funzionalità MSM, aggiungere i seguenti parametri MSM alla proprietà multistringa storeReaderFields:

      • msm:isSource
      • msm:isInBlueprint
      • msm:isLiveCopy
  4. Aggiungi un nodo starred (di tipo nt:unstructured) sotto /apps/wcm/core/content/siteadmin/grid/geometrixx/columns con le seguenti proprietà:

    • dataIndex: starred di tipo String

    • intestazione: Starred di tipo String

    • xtype: gridcolumn di tipo String

  5. (facoltativo) Rilasciare le colonne che non si desidera visualizzare in /apps/wcm/core/content/siteadmin/grid/geometrixx/columns

  6. /siteadmin è un percorso personalizzato che, per impostazione predefinita, punta a /libs/wcm/core/content/siteadmin.
    Per reindirizzarlo alla versione di siteadmin in /apps/wcm/core/content/siteadmin, definire la proprietà sling:vanityOrder in modo che abbia un valore superiore a quello definito in /libs/wcm/core/content/siteadmin. Il valore predefinito è 300, quindi qualsiasi valore più alto è adatto.

  7. Passa alla console di amministrazione dei siti Web e passa al Geometrixx:
    https://localhost:4502/siteadmin#/content/geometrixx.

  8. La nuova colonna denominata Starred è disponibile e visualizza le informazioni personalizzate nel modo seguente:

schermata_shot_2012-02-14at104602

CAUTION
Se più configurazioni della griglia corrispondono al percorso richiesto definito dalla proprietà pathRegex, viene utilizzato il primo e non il più specifico, il che significa che l'ordine delle configurazioni è importante.

Pacchetto di esempio sample-package

Il risultato di questa esercitazione è disponibile nel pacchetto Personalizzazione della console di amministrazione dei siti Web in Condivisione pacchetti.

recommendation-more-help
19ffd973-7af2-44d0-84b5-d547b0dffee2