Show Menu
ARGOMENTI×

Incorporazione di un modulo adattivo o di una comunicazione interattiva in un'applicazione pagina singola AEM Sites

Panoramica

I AEM Forms consentono agli sviluppatori di moduli di incorporare facilmente moduli adattivi e comunicazioni interattive in un'applicazione SPA (Single Page Application) AEM Sites. Il modulo adattivo incorporato e la comunicazione interattiva sono completamente funzionanti e gli utenti possono compilare e inviare il modulo senza uscire dalla pagina. Consente agli utenti di restare nel contesto di altri elementi della pagina Web e di interagire contemporaneamente con il modulo adattivo o la comunicazione interattiva.
Nell’applicazione AEM Sites pagina singola, è possibile aggiungere un modulo adattivo o una comunicazione interattiva utilizzando il componente contenitore SPA AEM Forms. È un componente AEM Forms per gli SPA AEM Sites che potete aggiungere alla pagina Siti.
Per informazioni sull'incorporazione di un modulo adattivo in un AEM Sites non SPA, vedere Incorporare un modulo adattivo o comunicare interattiva nella pagina AEM Sites.

Prerequisiti

Per incorporare un modulo adattivo o una comunicazione interattiva in un sito AEM SPA utilizzando il componente AEM Forms SPA Container, accertatevi di aver installato:
  • Java SE Development Kit 8 o successivo
  • Apache Maven 3.3.1 o successivo
  • istanza di creazione AEM
  • Pacchetto aggiuntivo AEM Forms 6.4.2 per l’istanza di creazione

Installazione del componente Contenitore SPA AEM Forms

Effettuate i seguenti passaggi per installare il componente AEM Forms SPA Container:
  1. Installate il componente AEM Forms per SPA. Le istruzioni per installare il componente sono disponibili nel file README.md .
    Il componente include un esempio di componente React che può essere utilizzato per integrare il componente contenitore SPA con un progetto SPA basato su React.
  2. Clona o scarica un progetto SPA basato su React.
  3. Integrare il componente contenitore SPA con un progetto SPA basato su React utilizzando le istruzioni disponibili nel file README.md .
    Dopo aver installato il componente AEM Forms SPA Container e integrato il componente con un progetto SPA basato su React, è possibile incorporare moduli adattivi e comunicazioni interattive nella pagina AEM Sites.

Incorporare un modulo adattivo o una comunicazione interattiva

Per incorporare un modulo adattivo o una comunicazione interattiva utilizzando AEM Forms per il componente Contenitore SPA:
  1. Aprite la pagina Siti AEM, in modalità di modifica, in cui desiderate incorporare un modulo adattivo o una comunicazione interattiva.
  2. Inserite nella pagina il componente Modulo AEM per SPA utilizzando una delle seguenti opzioni:
    • Toccate il Contenitore di layout nella pagina Siti, toccate + e selezionate il componente Modulo AEM per SPA .
    • Dal pannello del browser Componenti, trascina sulla pagina il componente Modulo AEM per SPA .
    • Cercate un modulo adattivo o una comunicazione interattiva nel browser Risorse e trascinatelo nella pagina Siti. Incorpora il modulo in un AEM Forms per il contenitore di componenti SPA.
    Il rendering di più componenti SPA Container AEM Forms in una pagina non è supportato. Potete avere più AEM Forms SPA Container su una pagina, ma viene eseguito il rendering di un solo componente alla volta. Per evitare discrepanze, accertatevi che sulla pagina sia visibile un solo componente.
  3. Toccate il componente AEM Forms SPA Container nella pagina dei siti, quindi toccate sulla barra delle azioni. Viene visualizzata la finestra di dialogo Edit AEM Forms SPA Container .
  4. Nella finestra di dialogo Modifica contenitore AEM Forms, specificate quanto segue:
    • Tipo risorsa: Selezionate il tipo di risorsa da incorporare. Le opzioni sono Modulo ​adattivo e Comunicazione interattiva
    • Percorso risorsa: Individuate e selezionate il modulo adattivo o la comunicazione interattiva da incorporare. Il campo viene popolato automaticamente se viene inserito un modulo adattivo o una comunicazione interattiva tramite il browser Risorse.
    • Canale (Solo Comunicazione Interattiva): Selezionate il tipo di canale interattivo da incorporare. Le opzioni sono Canale ​Web e Canale ​di stampa.
    • Tema : Selezionate un tema che definisca lo stile dei componenti del modulo adattivo o della comunicazione interattiva. Lo stile include proprietà di aspetto quali lo stile del font, il colore di sfondo, le dimensioni e l'allineamento.
  5. Toccate per salvare le impostazioni. Il modulo adattivo o la comunicazione interattiva ora è incorporato nella pagina.

Pubblicare un modulo adattivo incorporato e Comunicazione interattiva

Considerate i seguenti scenari per pubblicare una risorsa incorporata (modulo adattivo o comunicazione interattiva) nella pagina AEM Sites:
  • Se pubblicate la pagina AEM Sites per la prima volta e include un modulo adattivo incorporato o una comunicazione interattiva, pubblicate la pagina Siti e la risorsa incorporata.
  • Se avete modificato solo il modulo adattivo incorporato o la comunicazione interattiva in una pagina Siti pubblicati, pubblicate la risorsa originale e le modifiche si riflettono nella pagina Siti pubblicati. La pagina Siti pubblicati include un riferimento alla risorsa e non richiede la ripubblicazione della pagina.
  • Se avete modificato la pagina Siti e il modulo adattivo incorporato o la comunicazione interattiva, ripubblicate la pagina Siti e la risorsa incorporata.

Modifica di moduli adattivi incorporati e comunicazione interattiva

Nella pagina dei siti AEM viene mantenuto un riferimento al modulo adattivo e alla comunicazione interattiva nel contenitore AEM Forms. Pertanto, tutte le configurazioni e proprietà, come il tema, gli stili e l'azione Invia, configurate nel modulo adattivo originale e nella comunicazione interattiva vengono mantenute nel modulo adattivo incorporato e nella comunicazione interattiva.
Per modificare qualsiasi configurazione o proprietà del modulo adattivo incorporato e della comunicazione interattiva, effettuare una delle seguenti operazioni.
  • Aprire il modulo originale nei moduli adattivi o nelle comunicazioni interattive nei rispettivi editor e modificarlo.
  • Toccate il modulo adattivo o la comunicazione interattiva dalla pagina Siti in modalità di modifica, quindi toccate Modifica in una nuova finestra . Il modulo originale viene aperto in modalità di modifica.

Considerations and best practices

Quando incorporate moduli adattivi nelle pagine dei siti AEM, tenete presente quanto segue:
  • L'intestazione e il piè di pagina del modulo originale non sono inclusi nel modulo incorporato.
  • Le bozze degli utenti e gli invii dei moduli incorporati sono supportati e visibili nelle schede Bozze e Moduli inviati nel portale dei moduli.
  • L'azione di invio configurata sul modulo originale viene mantenuta nel modulo incorporato.
  • Il targeting delle esperienze e i test A/B configurati sul modulo originale non funzionano nel modulo incorporato. Tuttavia, potete utilizzare il targeting delle esperienze nella pagina Siti per presentare moduli diversi basati sui profili utente.
  • Se per il modulo originale è stato configurato Adobe Analytics, i dati di analisi del modulo incorporato vengono acquisiti in Adobe Analytics. Tuttavia, non è disponibile nel report di analisi dei moduli.