Componente di incorporamento

Il componente Incorpora componenti core consente di incorporare contenuto esterno in una pagina di contenuto AEM.

Utilizzo

Il componente di base Incorpora componente consente all’autore del contenuto di definire il contenuto esterno selezionato da incorporare all’interno di una pagina di contenuto AEM. Inoltre, è disponibile un’opzione per definire anche l’HTML in formato libero da incorporare.

• Le proprietà del componente possono essere definite nella finestra di dialogo configura.
• I valori predefiniti per il componente quando lo si aggiunge a una pagina possono essere definiti nella finestra di dialogo progettazione.

Versione e compatibilità

La versione corrente del componente da incorporare è la v1, introdotta con la versione 2.7.0 dei componenti core a settembre 2019, ed è descritta in questo documento.

La tabella seguente descrive tutte le versioni supportate del componente, le versioni AEM con cui le versioni del componente sono compatibili e si collega alla documentazione delle versioni precedenti.

Per ulteriori informazioni sulle versioni e sulle versioni dei componenti core, consulta il documento Versioni dei componenti core .

Output componente di esempio

Per visualizzare esempi delle opzioni di configurazione e dell’output HTML e JSON del componente da incorporare, visita la Libreria dei componenti.

Dettagli tecnici

La documentazione tecnica più recente sul componente da incorporare è disponibile su GitHub.

Per ulteriori informazioni sullo sviluppo dei componenti core, consulta la documentazione per gli sviluppatori dei componenti core .

Finestra di dialogo Configura

La finestra di dialogo di configurazione consente all’autore del contenuto di definire la risorsa esterna da incorporare nella pagina. Scegli innanzitutto il tipo di risorsa da incorporare:

• URL
• Contenuto incorporabile
• HTML

Per ogni tipo di incorporabile, puoi definire l'annuncio ID. Questa opzione consente di controllare l'identificatore univoco del componente nell'HTML e nel Livello dati.

• Se lasciato vuoto, viene generato automaticamente un ID univoco che può essere trovato controllando la pagina risultante.
• Se viene specificato un ID, è responsabilità dell’autore assicurarsi che sia univoco.
• La modifica dell’ID può avere un impatto su CSS, JS e tracciamento livello dati.

URL

L’incorporamento più semplice è l’URL. È sufficiente incollare l’URL della risorsa da incorporare nel campo URL . Il componente tenterà di accedere alla risorsa e, se può essere riprodotto da uno dei processori, visualizzerà un messaggio di conferma sotto il campo URL . In caso contrario, il campo verrà contrassegnato per errore.

Il componente Incorpora viene fornito con processori per i seguenti tipi di risorse:

• Risorse conformi allo standard di incorporamento, inclusi Facebook Post, Instagram, SoundCloud, Twitter e YouTube
• Pinterest

Gli sviluppatori possono aggiungere processori URL aggiuntivi seguendo la documentazione per gli sviluppatori del componente di incorporamento.

Contenuto incorporabile

Le tabelle da incorporare consentono una maggiore personalizzazione della risorsa incorporata, che può essere parametrizzata e includere informazioni aggiuntive. Un autore può scegliere tra file da incorporare affidabili preconfigurati e il componente viene fornito con un YouTube incorporato pronto all’uso.

Il campo Incorporabile definisce il tipo di processore che si desidera utilizzare. Nel caso di YouTube embeddable puoi quindi definire:

• ID video : l’ID video univoco di YouTube della risorsa da incorporare
• Larghezza - Larghezza del video incorporato
• Altezza - Altezza del video incorporato
• Abilita muto : questo parametro specifica se il video verrà riprodotto in modo disattivato per impostazione predefinita. L’abilitazione di questa opzione aumenta le possibilità che Autoplay funzioni nei browser moderni.
• Abilita riproduzione automatica : questo parametro specifica se il video iniziale verrà avviato automaticamente al caricamento del lettore. Questa opzione è valida solo per l'istanza di pubblicazione o quando si utilizza l'opzione Visualizza come pubblicato sull'istanza di authoring.
• Abilita loop : nel caso di un singolo video, questo parametro specifica se il lettore deve riprodurre ripetutamente il video iniziale. Nel caso di una playlist, il lettore riproduce l'intera playlist e quindi riparte dal primo video.
• Abilita riproduzione in linea (iOS) : questo parametro controlla se i video vengono riprodotti in linea (on) o a schermo intero (off) in un lettore HTML5 su iOS.
• Video correlati illimitati - Se questa opzione è disattivata, i video correlati verranno dallo stesso canale del video appena riprodotto, altrimenti verranno da qualsiasi canale.

Le opzioni "enable" devono essere attivate tramite la finestra di dialogo Progettazione e possono essere impostate come valori predefiniti.

Altri elementi incorporati offrirebbero campi simili e possono essere definiti da uno sviluppatore da seguendo la documentazione per gli sviluppatori del componente di incorporamento.

HTML

Puoi aggiungere alla pagina codice HTML in formato libero utilizzando il componente Incorpora .

Sicurezza

Il markup HTML che l’autore può immettere viene filtrato a scopo di sicurezza per evitare attacchi di script tra siti che potrebbero, ad esempio, consentire agli autori di ottenere diritti amministrativi.

In generale, tutti gli script e style gli elementi nonché tutti gli attributi on* e style verranno rimossi dall’output.

Tuttavia, le regole sono più complicate perché il componente Incorpora segue AEM set di regole di filtro del framework HTML AntiSamy di pulizia globale, che si trovano in /libs/cq/xssprotection/config.xml. Se necessario, uno sviluppatore può sovrapporre questa impostazione per la configurazione specifica del progetto.

Ulteriori informazioni sulla sicurezza sono disponibili nella documentazione per gli sviluppatori di AEM per le installazioni on-premise e AEM come installazioni di Cloud Service.

Finestra di dialogo Progettazione

La finestra di dialogo Progettazione consente all’autore del modello di definire le opzioni disponibili per l’autore del contenuto che utilizza il componente da incorporare e le impostazioni predefinite al momento del posizionamento del componente da incorporare.

Scheda Tipi da incorporare

• Disattiva URL : disabilita l’opzione ​​URL per l’autore del contenuto quando è selezionato
• Disabilita elementi da incorporare : disabilita l’opzione ​​Embedable per l’autore del contenuto quando selezionato, indipendentemente dai processori da incorporare consentiti.
• Disabilita HTML - Disattiva l’opzione ​​HTML per l’autore del contenuto quando è selezionato.
• Embeddables consentiti : selezione multipla che definisce quali processori incorporabili sono disponibili per l’autore dei contenuti, a condizione che l’opzione ​​Embeddableoption sia attiva.

Scheda YouTube

• Consenti configurazione del comportamento muto : consente all’autore del contenuto di configurare l’opzione Abilita muteopzione nel componente quando è selezionato il tipo di incorporamento di YouTube
  • Valore predefinito muto : imposta automaticamente Enable Muteoption quando è selezionato il tipo di incorporamento YouTube
• Consenti configurazione del comportamento di riproduzione automatica : consente all’autore del contenuto di configurare l’opzione Abilita riproduzione automatica nel componente quando è selezionato il tipo di incorporamento YouTube
  • Valore predefinito dell'esecuzione automatica : imposta automaticamente l'opzione Abilita riproduzione automatica quando è selezionato il tipo di incorporamento YouTube
• Consenti configurazione del comportamento del ciclo : consente all’autore del contenuto di configurare l’opzione Abilita percorso nel componente quando è selezionato il tipo di incorporamento YouTube
  • Valore predefinito del ciclo : imposta automaticamente Abilita percorso quando è selezionato il tipo di incorporamento YouTube
• Consenti configurazione della riproduzione in linea (iOS) : consente all’autore del contenuto di configurare l’opzione Abilita riproduzione in linea (iOS) nel componente quando è selezionato il tipo di incorporamento YouTube
  • Valore predefinito di riproduzione in linea (iOS) : imposta automaticamente l'opzione Abilita riproduzione in linea (iOS) quando è selezionato il tipo di incorporamento YouTube
• Consenti configurazione di video in linea - Consente all’autore del contenuto di configurare la visualizzazione correlata senza restrizioni nel componente quando è selezionato il tipo di incorporamento YouTube
  • Valore predefinito dei video correlati senza restrizioni - Imposta automaticamente la visualizzazione correlata senza restrizioni quando è selezionato il tipo di incorporamento YouTube