Visualizzare più documenti PDF in un carosello

Un caso d’uso comune prevede la visualizzazione di più documenti PDF alla casella di compilazione del modulo, da esaminare prima dell’invio del modulo.

Per eseguire questo caso d’uso abbiamo utilizzato API di incorporamento Adobe PDF.

Qui puoi trovare una demo live di questo esempio.

Per completare l’integrazione sono stati eseguiti i seguenti passaggi

Creare un componente personalizzato per visualizzare più documenti PDF

È stato creato un componente personalizzato (pdf-carosello) per scorrere i documenti pdf

Libreria client

È stata creata una libreria client per visualizzare i PDF mediante l’API di incorporamento di Adobe PDF. I PDF da visualizzare sono specificati nei componenti pdf-carosello.

Creare un modulo adattivo

Creare un modulo adattivo basato su alcune schede (questo esempio contiene 3 schede) Aggiungere alcuni componenti del modulo adattivo nelle prime due schede Aggiungere il componente Carosello pdf nella terza scheda Configurare il componente Carosello pdf come mostrato nella schermata seguente
pdf-carosello

Incorpora chiave API PDF : questa è la chiave che puoi utilizzare per incorporare il PDF. Questa chiave funziona solo con localhost. Puoi creare la tua chiave e associarlo ad un altro dominio.

Specifica documenti PDF - Qui puoi specificare i documenti pdf da visualizzare nel carosello.

Distribuire l’esempio sul server

Per eseguire il test sul server locale, eseguire la procedura seguente:

  1. Importare la libreria client nell’istanza AEM locale utilizzo del gestore di pacchetti
  2. Importare il componente carosello pdf nell’istanza AEM locale utilizzo del gestore di pacchetti
  3. Importare il modulo adattivo nell’istanza AEM locale utilizzo del gestore di pacchetti
  4. Importa i PDF di esempio da visualizzare nell’istanza AEM locale utilizzo del collegamento di caricamento file delle risorse
  5. Anteprima modulo adattivo
  6. Passare alla scheda Documenti da rivedere. Dovresti visualizzare tre documenti PDF nel componente Carosello.
recommendation-more-help
8de24117-1378-413c-a581-01e660b7163e