DocumentazioneAEM 6.4Guida di Forms

Modifica degli stili predefiniti dei moduli di HTML5 changing-default-styles-of-html-forms

Last update: Thu May 04 2023 00:00:00 GMT+0000 (Coordinated Universal Time)

Creato per:

  • User
CAUTION
AEM 6.4 ha raggiunto la fine del supporto esteso e questa documentazione non viene più aggiornata. Per maggiori dettagli, consulta la nostra periodi di assistenza tecnica. Trova le versioni supportate qui.

Il rendering dei moduli di HTML5 viene eseguito utilizzando le funzionalità di HTML5 e lo stile del modulo di cui è stato effettuato il rendering viene eseguito utilizzando i CSS. L’aspetto predefinito di un modulo HTML5 è simile al rendering di PDF. Gli sviluppatori possono utilizzare CSS personalizzati per modificare l’aspetto predefinito dei moduli di HTML5.

Questo articolo fornisce informazioni dettagliate per modificare lo stile di un modulo HTML5 e Introduzione agli stili questo articolo contiene informazioni dettagliate su vari aspetti dello stile dei moduli HTML5. Assicurati di aver letto Introduzione agli stili prima di eseguire i passaggi menzionati in questo articolo.

Le due immagini seguenti mostrano la differenza tra gli stili predefiniti e personalizzati.

picture-002-small

Personalizzare lo stile dei moduli style-your-forms

  1. Scegliere un profilo per aggiungere stili personalizzati

    Accedi all'interfaccia CRX DE all'URL: https://<server>:<port>/crx/de e crea un profilo o scegli un profilo esistente. Per informazioni su come creare un profilo, consulta Creazione di un nuovo profilo

  2. Creare un foglio di stile CSS per lo stile dei moduli HTML5

    Passa alla cartella in cui hai creato il renderer del profilo e crea un file foglio di stile CSS. I passaggi da seguire sono

    1. Fai clic con il pulsante destro del mouse sulla cartella e seleziona creare -> crea file dal menu

    Per sapere quali classi CSS creare per un particolare componente nei moduli di HTML5, consulta Introduzione agli stili.

  3. Includere il foglio di stile nel modulo di rendering del profilo

    Apri la pagina Renderer di profilo (file jsp) in CRX DE e includi il file CSS nella pagina immediatamente sotto la libreria client XFA. Esegui questi passaggi per includere il file CSS nel profilo.

    1. Cerca nella pagina del renderer la seguente riga:

      <cq:includeClientLib categories="xfaforms.profile" />

    2. Inserire quanto segue sotto la riga precedente per includere il foglio di stile:

      <link href="/path/to/stylesheet" rel="stylesheet" type="text/css"/>

    3. Salva il file.

recommendation-more-help
a6ebf046-2b8b-4543-bd46-42a0d77792da