Risoluzione dei problemi con le tabelle nel nuovo editor degli articoli

Quando si esegue la migrazione dall’editor di articoli legacy al nuovo editor, potrebbero verificarsi problemi di stile delle tabelle.

Questo articolo mostra come risolvere i problemi più comuni dopo la migrazione al nuovo editor.

Questo articolo include i seguenti argomenti:

• Come risolvere un problema a capo di una tabella <figura> elementi
• Come risolvere i problemi di formato dell’intestazione e del formato dell’intestazione delle tabelle
• Come risolvere i problemi di allineamento e formato delle tabelle

Come risolvere un problema a capo di una tabella <figura> elementi

Usa il nuovo editor di articoli <figure> per fornire stili e funzionalità coerenti per le tabelle su browser e piattaforme diversi. Questo comportamento fa parte della nuova architettura del plug-in delle tabelle del nuovo editor. Può causare problemi di stile, come un’altezza della tabella limitata o problemi di formato indesiderati. Questa sezione spiega perché ciò accade e come prevenirlo o risolverlo.

Importante: Prima di apportare modifiche sostanziali, esegui il backup del codice CSS e dei contenuti.

Il nuovo editor di articoli racchiude le tabelle <figure class="table"> e possono applicare stili incorporati che sostituiscono le classi personalizzate.

Per risolvere il problema, ripristina gli stili tabella:

1. Aggiorna i selettori CSS per scegliere come target il nuovo markup:
   • figure.table table { /* your table styles */ }
   • figure.table th, figure.table td { /* cell styles */ }
2. Usa !important con parsimonia per sovrascrivere gli stili incorporati, se necessario
3. Prova le modifiche in un articolo duplicato prima di applicarle a tutto il sito

Per prevenire o risolvere i problemi di avvolgimento delle tabelle:

• Verifica il codice CSS del centro assistenza per assicurarti che sia così <figure class="table"> gli elementi non hanno stili restrittivi, come le impostazioni di altezza massima o overflow
• Se riscontri problemi di stile, aggiorna il codice CSS su target <figure class="table"> come mostrato:
  figure.table {
max-height: none;
overflow: visible;
}
• Se esegui la migrazione dei contenuti, non rimuoverli <figure> tag a mano. Il nuovo editor di articoli potrebbe aggiungerli di nuovo quando modifichi il contenuto.

Nota: Questa guida si basa sulla conoscenza generale del prodotto e non è presente in modo esplicito nei ticket originali. Il nuovo editor di articoli si basa su <figure> wrapper in base alla progettazione per il assistenza e l’uniformità delle funzionalità. L’approccio consigliato per risolvere i problemi di stile è la personalizzazione del codice CSS del centro assistenza , anziché tentare di cambiare l’HTML di output dell’editor.

Come risolvere i problemi di formato dell’intestazione e del formato dell’intestazione delle tabelle

Problemi di formato comuni dopo la migrazione:

• Le intestazioni delle tabelle potrebbero perdere il colore o gli stili di sfondo
• Le celle dell’intestazione della tabella potrebbero essere convertite in modo errato in testo H2
• Le dimensioni H2 e H3 potrebbero apparire diverse a causa di modifiche al CSS predefinito o personalizzato
• L’editor potrebbe non salvare le modifiche alle tabelle come previsto

Per garantire che le intestazioni delle tabelle vengano visualizzate correttamente dopo la migrazione:

1. Nel tema del centro assistenza , aggiungi le regole CSS come destinazione <thead> o <th> elementi, ad esempio:
   thead { background-color: #f5f5f5; }
th { background-color: #f5f5f5; }
2. Mantieni o aggiorna quelli esistenti <th> per mantenere la coerenza

Per impostare le intestazioni delle tabelle nel nuovo editor degli articoli:

1. Nell’articolo, seleziona la tabella, quindi fai clic sulla riga in alto
2. Dal menu a discesa Riga , attiva l’opzione Riga di intestazione
   • Se l’opzione della riga di intestazione non è presente, aggiungi manualmente <thead> e <th> nel codice sorgente HTML oppure verifica la disponibilità di plug-in o opzioni dell’editor nella nuova configurazione dell’editor di articoli

Se gli stili H2 o H3 appaiono errati

Verifica e aggiorna i livelli delle intestazioni:

1. Modifica l’articolo nel nuovo editor di articoli
2. Seleziona il testo dell’intestazione di tabella che l’editor ha convertito in H2
3. Cambia il formato impostando lo stile corretto, ad esempio l’intestazione di una tabella o il testo normale

Modifica le dimensioni a livello di intestazione con CSS:

1. Vai ad Amministratore Knowledge > Personalizza il design > Personalizza > Modifica codice > style.CSS
2. Aggiorna il CSS per assicurarti che gli stili H2, H3 e simili corrispondano alle dimensioni desiderate
3. Usa la funzione Anteprima per controllare il formato finale prima di fare clic su Pubblica

Se l’editor non salva le modifiche alla tabella o se vengono visualizzati errori come l’assenza di modifiche:

1. Prova a riprodurre il problema
2. Acquisisci un file di archivio HTTP (HAR) e una schermata
3. Contatta l'assistenza clienti Zendesk per ulteriore assistenza.

Per ulteriori informazioni, consulta i seguenti articoli:

• Correzione dello stile delle tabelle durante la transizione al nuovo editor di articoli
• Aggiunta e formattazione di tabelle negli articoli del centro assistenza

Suggerimento: Se hai molti articoli da aggiornare, prendi in considerazione uno script batch o uno strumento di migrazione per standardizzare i livelli e gli stili delle intestazioni ed esegui sempre il backup degli articoli prima di apportare modifiche in blocco. Se la nuova implementazione dell’editor di articoli non presenta alcune funzionalità delle tabelle, controlla la disponibilità di plug-in o contatta l’amministratore della piattaforma per miglioramenti.

Come risolvere i problemi di allineamento e formato delle tabelle

Problemi comuni dopo la migrazione:

• Gli stili di tabella personalizzati per larghezza e bordi non si applicano come prima
• Dimensioni del testo e spazio nella cella incoerenti
• Classi di tabelle e stili dei bordi cambiati durante una migrazione
• Righe di intestazione suddivise in <thead> e <tbody>, che causa incoerenze di stile

Per risolvere questi problemi:

• Aggiorna il CSS del centro assistenza per scegliere come target gli elementi della tabella
  .article-body td, .article-body th {
padding: 20px;
font-size: 16px;
}
• Correggi l’allineamento della tabella
  • Usa le nuove opzioni di allineamento delle tabelle dell’editor di articoli. Il nuovo editor di articoli potrebbe avere meno funzioni rispetto all’editor legacy.
  • Se le tabelle vengono centrate ogni volta o l’allineamento non funziona, aggiungi o modifica CSS:
    .article-body table {
margin-left: 0 !important;
margin-right: auto !important;
}
• Gestisci lo spazio e l’allineamento delle celle della tabella
  • Rimuovi gli stili incorporati non necessari che impostano lo spazio delle celle in modo che il CSS del tema controlli tale proprietà
  • Definisci lo spazio di cella desiderato nel CSS del tema
• Modifica le classi, i bordi e le intestazioni delle tabelle
  • Aggiorna le regole CSS per qualsiasi classe di tabella nuova o modificata, ad esempio .nonItemList
  • Assicurati che tutte le righe di intestazione siano all’interno <thead> per uno styling corretto
  • Sposta le righe di intestazione da <tbody> a <thead> come necessario
• Prova e verifica le modifiche
  • Visualizza in anteprima gli articoli interessati nel nuovo editor di articoli per confermare la formattazione
  • Ripeti per ogni articolo con tabelle personalizzate, in quanto potrebbe essere necessaria una revisione manuale

Per maggiori informazioni, consulta Passaggio al nuovo editor di articoli

Avvertenza sulla traduzione: questo articolo è stato tradotto usando un software di traduzione automatizzata per fornire una comprensione di base del contenuto. È stato fatto tutto il possibile per fornire una traduzione accurata, tuttavia Zendesk non garantisce l'accuratezza della traduzione.

Per qualsiasi dubbio sull'accuratezza delle informazioni contenute nell'articolo tradotto, fai riferimento alla versione inglese dell'articolo come versione ufficiale.