Personalizzazione delle console

ATTENZIONE

Questo documento descrive come personalizzare le console nell’interfaccia touch moderna e non applicabile all’interfaccia classica.

AEM offre diversi metodi per personalizzare le console (e la funzionalità di authoring delle pagine) dell’istanza di authoring.

  • Clientlibs

    Clientlibs consente di estendere l'implementazione predefinita per realizzare nuove funzionalità, riutilizzando le funzioni, gli oggetti e i metodi standard. Quando si personalizzano, è possibile creare clientlib personalizzate in /apps. Ad esempio, può contenere il codice richiesto per il componente personalizzato.

  • Sovrapposizioni

    Le sovrapposizioni si basano sulle definizioni dei nodi e consentono di sovrapporre la funzionalità standard (in /libs) con la propria funzionalità personalizzata (in /apps). Quando create una sovrapposizione, non è necessaria una copia 1:1 dell’originale, in quanto la fusione delle risorse di sling consente l’ereditarietà.

che possono essere utilizzati in molti modi per estendere le console AEM. Di seguito è riportata una piccola selezione (ad alto livello).

NOTA

Per ulteriori informazioni, consulta:

Questo argomento è trattato anche nella sessione AEM Gems - Personalizzazione dell'interfaccia utente per AEM 6.0.

ATTENZIONE

non è necessario modificare nulla nel percorso /libs.

Questo perché il contenuto di /libs viene sovrascritto al successivo aggiornamento dell'istanza (e potrebbe essere sovrascritto quando si applica un hotfix o un feature pack).

Il metodo consigliato per la configurazione e altre modifiche è:

  1. Ricreare l'elemento richiesto (ovvero come esiste in /libs) in /apps

  2. Apportare modifiche all'interno di /apps

Ad esempio, è possibile sovrapporre le seguenti posizioni all'interno della struttura /libs:

  • console (qualsiasi console basata sulle pagine dell’interfaccia Granite); ad esempio:

    • /libs/wcm/core/content
NOTA

Per ulteriori suggerimenti e strumenti, consulta l'articolo della Knowledge Base, Risoluzione dei problemi AEM TouchUI issues.

Personalizzazione della visualizzazione predefinita per una console

Potete personalizzare la visualizzazione predefinita (colonna, scheda, elenco) per una console:

  1. Potete riordinare le viste sovrapponendo la voce richiesta da sotto:

    /libs/wcm/core/content/sites/jcr:content/views

    La prima voce sarà quella predefinita.

    I nodi disponibili sono correlati alle opzioni di visualizzazione disponibili:

    • column
    • card
    • list
  2. Ad esempio, in una sovrapposizione per un elenco:

    /apps/wcm/core/content/sites/jcr:content/views/list

    Definire la proprietà seguente:

    • Nome: sling:orderBefore
    • Tipo: String
    • Valore: column

Aggiungi nuova azione alla barra degli strumenti

  1. Potete creare componenti personalizzati e includere le librerie client corrispondenti per le azioni personalizzate. Ad esempio, un'azione Passa a Twitter all'indirizzo:

    /apps/wcm/core/clientlibs/sites/js/twitter.js

    È quindi possibile collegarlo a un elemento della barra degli strumenti presente nella console:

    /apps/<yourProject>/admin/ext/launches

    Ad esempio, in modalità di selezione:

    content/jcr:content/body/content/header/items/selection/items/twitter

Limita un'azione barra degli strumenti a un gruppo specifico

  1. Potete utilizzare una condizione di rendering personalizzata per sovrapporre l'azione standard e imporre condizioni specifiche che devono essere soddisfatte prima del rendering.

    Ad esempio, create un componente per controllare le condizioni di rendering in base al gruppo:

    /apps/myapp/components/renderconditions/group

  2. Per applicare queste opzioni all’azione Crea sito nella console Siti:

    /libs/wcm/core/content/sites

    Create la sovrapposizione:

    /apps/wcm/core/content/sites

  3. Quindi aggiungete la condizione di rendering per l’azione:

    jcr:content/body/content/header/items/default/items/create/items/createsite/rendercondition

    Utilizzando le proprietà di questo nodo è possibile definire il groups consentito per eseguire l'azione specifica; ad esempio, administrators

Personalizzazione delle colonne nella vista Elenco

NOTA

Questa funzione è ottimizzata per le colonne di campi di testo; per altri tipi di dati è possibile sovrapporre cq/gui/components/siteadmin/admin/listview/columns/analyticscolumnrenderer in /apps.

Per personalizzare le colonne nella vista a elenco:

  1. Sovrapporre l’elenco delle colonne disponibili.

    • Sul nodo:

      /apps/wcm/core/content/common/availablecolumns

    • Aggiungete le nuove colonne o rimuovete quelle esistenti.

    Per ulteriori informazioni, vedere Utilizzo delle sovrapposizioni (e la fusione delle risorse Sling).

  2. Facoltativamente:

    • Se si desidera collegare dati aggiuntivi, è necessario scrivere un [PageInforProvider](https://helpx.adobe.com/it/experience-manager/6-4/sites/developing/using/reference-materials/javadoc/com/day/cq/wcm/api/PageInfoProvider.html) con un

      pageInfoProviderType proprietà.
      Ad esempio, vedete la classe/pacchetto collegato (da GitHub) di seguito.

  3. È ora possibile selezionare la colonna nel configuratore colonna della vista a elenco.

Risorse filtro

Quando si utilizza una console, un caso comune è quando l’utente deve selezionare una delle risorse (ad esempio pagine, componenti, risorse ecc.). Può assumere la forma di un elenco, ad esempio da cui l’autore deve scegliere un elemento.

Per mantenere l'elenco a dimensioni ragionevoli e anche pertinente al caso d'uso, è possibile implementare un filtro sotto forma di predicato personalizzato. Per ulteriori informazioni, vedere questo articolo.

In questa pagina

Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now