Creazione di componenti

I componenti AEM vengono utilizzati per conservare, formattare ed eseguire il rendering del contenuto reso disponibile sulle pagine web.

NOTA

Per informazioni dettagliate sulla creazione di componenti AEM, consulta Sviluppo di componenti AEM.

Canali di authoring

Il canale è l'oggetto centrale del contenuto distribuito a un set di display. Pertanto, un autore di contenuti solitamente apre un canale nell’editor per aggiungere o modificare contenuti. Poiché il Canale è un cq:Page, seguirà lo stesso pattern UX tradizionale per aggiungere e modificare i componenti sul canale.

Tuttavia, poiché in genere i componenti all’interno di un canale vengono sottoposti a rendering a schermo intero, l’esperienza di authoring subirà delle conseguenze quando si tenta di modificare singoli componenti o comporre nuovi ordini. Pertanto, il canale si affiderà ai selettori per eseguire il rendering di diverse viste dei componenti. L’ambiente di authoring sfrutta il selettore di modifica per attivare il rendering del canale personalizzato.

Esempio, http://localhost:4502/editor.html/content/screens/we-retail/channels/idle.edit.html] (http://localhost:4502/editor.html/content/screens/we-retail/channels/idle.edit.html

L’utente non deve occuparsi di aggiungere il selettore all’URL durante la modifica. Una logica lato client sta ascoltando l'evento dell'interruttore di livello e aggiunge il selettore se un canale ha il tipo di risorsa dedicato screens/core/components/channel.

Componenti di rendering

Per abilitare l’authoring corretto, i componenti devono fornire i due rendering seguenti:

Componente Rappresentazioni
my-component/my-component.html rendering della produzione
my-component/edit.html modifica del rendering in una visualizzazione più piccola

I componenti incorporati sfruttano le seguenti categorie di librerie client:

Componente Libreria client
cq.screens.components.edit CSS e JS da caricare durante l’authoring
cq.screens.components.production CSS e JS da caricare quando il canale è in esecuzione
cq.screens.components CSS e JS condivisi
NOTA

Per sviluppare componenti personalizzati, utilizza il modello di componente di esempio AEM Screens.

In questa pagina

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
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