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:
- Verificare che il file CSS personalizzato sia posizionato nel percorso corretto, ad esempio
/var/dxml/folderprofiles/global-profile/XmlEditorConfigs/css_layout.css. - Verificare che i selettori CSS corrispondano alla struttura del contenuto DITA e al DOM in modalità Anteprima. Utilizzare ad esempio
.previewbody .testnoteper gli stili specifici dell’anteprima. - Aggiungi o aggiorna la regola CSS, quindi passa alla modalità Anteprima in AEM Guides per verificare che lo stile sia applicato.
- Assicurarsi che il contenuto DITA utilizzi l’attributo
outputclasscorretto che corrisponda al selettore CSS (ad esempio,outputclass="testnote"). - Cancella la cache del browser o utilizza un aggiornamento rigido dopo aver aggiornato i CSS per garantire il caricamento degli stili più recenti.
- 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