Panoramica dei componenti components-overview

Questa pagina fornisce una panoramica dei componenti di Adobe Experience Manager (AEM) come quelli utilizzati per l’authoring delle pagine.

Cosa sono i Componenti? what-exactly-is-a-component

  • Unità modulari che realizzano funzionalità specifiche per presentare i contenuti sul sito web.
  • Riutilizzabili.
  • Sviluppati come unità autonome all’interno di una cartella dell’archivio.
  • Non sono presenti file di configurazione nascosti.
  • Possono contenere altri componenti.
  • Può essere eseguito ovunque all'interno di qualsiasi sistema AEM. Possono anche essere limitate per l’esecuzione con componenti specifici.
  • Hanno un’interfaccia utente standard.
  • Hanno un comportamento di modifica configurabile.
  • Utilizzare finestre di dialogo create utilizzando sottoelementi basati su componenti dell’interfaccia utente Granite
  • Sono sviluppati utilizzando HTL (consigliato) o JSP.
  • Possono essere sviluppati per creare componenti personalizzati che estendono la funzionalità predefinita.

Poiché i componenti sono modulari, puoi:

  • Sviluppare un nuovo componente nell’istanza locale.
  • Distribuirlo nell’ambiente di test.
  • Distribuirlo nel tuo ambiente di authoring live, dove gli autori e/o gli amministratori possono aggiungere e configurare contenuti.
  • Distribuiscilo negli ambienti di pubblicazione live, dove viene utilizzato per eseguire il rendering dei contenuti per i visitatori del tuo sito web. Alcuni componenti, ad esempio per Communities, accettano l’input anche dagli utenti.

Ogni componente AEM:

  • È un tipo di risorsa.
  • È un insieme di script che realizzano completamente una funzione specifica.
  • Può funzionare in isolamento, ovvero all'interno di AEM o di un portale.

Componenti standard all’interno dell’AEM out-of-the-box-components-within-aem

AEM viene fornito con una serie di componenti predefiniti che forniscono funzionalità complete, tra cui:

  • Sistema paragrafi ( parsys)
  • Pagina ( responsivegrid - solo interfaccia touch)
  • Testo
  • Immagine, con testo associato
  • Barra degli strumenti

I componenti forniti e il loro utilizzo nei siti Web We.Retail di esempio forniti illustrano come implementare e utilizzare i componenti. I componenti sono forniti con tutto il codice sorgente e possono essere utilizzati così come sono o come punti di partenza per i componenti modificati o estesi.

Componenti core e componenti di base core-components-and-foundation-components

Sono disponibili due set di componenti AEM forniti dall’Adobe:

Componenti core sono stati introdotti con AEM 6.3 e offrono funzionalità flessibili e avanzate per l'authoring. Il sito di riferimento We.Retail illustra come utilizzare i Componenti core e rappresenta le best practice correnti per lo sviluppo dei componenti.

Componenti Foundation sono disponibili con AEM per molte versioni e sono disponibili come preconfigurati in un'installazione AEM standard. Anche se ancora supportate, la maggior parte sono state dichiarate obsolete, non sono più migliorate e si basano su tecnologie legacy.

NOTE
Componenti core rappresentano le best practice correnti per la progettazione e lo sviluppo di componenti e fungono da implementazioni di riferimento.
Gli strumenti di modernizzazione dell'AEM possono agevolare la migrazione ai Componenti core.

Visualizzazione dei componenti disponibili viewing-available-components

Per una panoramica di tutti i componenti disponibili nell'istanza AEM, utilizzare la console Componenti.

In alternativa, è possibile utilizzare CRXDE Lite per ottenere un elenco di tutti i componenti disponibili nell’archivio.

  1. In CRXDE Lite, seleziona Strumenti dalla barra degli strumenti, quindi Query, che apre la scheda Query.

  2. Nella scheda Query, seleziona XPath come Tipo.

  3. Nel campo di inserimento Query, immetti la stringa seguente:

    //element(*, cq:Component)

  4. Fai clic su Esegui e i componenti verranno elencati.

Risorse aggiuntive further-reading

Le pagine seguenti forniscono informazioni più dettagliate sullo sviluppo di questi e di altri componenti:

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