CSS personalizzato non visualizzato in modalità Anteprima

Questo articolo spiega come risolvere i problemi in cui le modifiche CSS personalizzate in AEM Guides non vengono visualizzate come previsto in modalità Anteprima.

Descrizione description

Ambiente

Guide di Adobe Experience Manager (AEM)

Problema/Sintomi

  • I CSS personalizzati applicati in AEM Guides non vengono visualizzati correttamente in modalità Anteprima.
  • Sono previste modifiche visive, come il colore di sfondo o gli stili dei bordi, ma non sono visibili quando si passa all’anteprima.
  • Non vengono visualizzati messaggi di errore, ma manca la formattazione prevista.

Causa

I file CSS personalizzati potrebbero non essere visualizzati in modalità Anteprima se il percorso, il selettore o la sintassi del file CSS non sono corretti o se la cache del browser impedisce il caricamento degli stili più recenti.

Risoluzione resolution

Per risolvere il problema, effettua le seguenti operazioni:

  1. Verificare che il file CSS personalizzato sia posizionato nel percorso corretto, ad esempio /var/dxml/folderprofiles/global-profile/XmlEditorConfigs/css_layout.css.
  2. Verificare che i selettori CSS corrispondano alla struttura del contenuto DITA e al DOM in modalità Anteprima. Utilizzare ad esempio .previewbody .testnote per gli stili specifici dell’anteprima.
  3. Aggiungi o aggiorna la regola CSS, quindi passa alla modalità Anteprima in AEM Guides per verificare che lo stile sia applicato.
  4. Assicurarsi che il contenuto DITA utilizzi l’attributo outputclass corretto che corrisponda al selettore CSS (ad esempio, outputclass="testnote").
  5. Cancella la cache del browser o utilizza un aggiornamento rigido dopo aver aggiornato i CSS per garantire il caricamento degli stili più recenti.
  6. Testa la modalità Anteprima in diversi browser per escludere problemi di caching o rendering specifici per il browser.

Dopo aver completato questi passaggi, verifica che gli stili personalizzati siano visibili in modalità Anteprima.

recommendation-more-help
experience-cloud-kcs-help-kbarticles