Editor Studio: aggiungere e personalizzare una tabella
Tempo di lettura: 6 min.
Utilizzi il Gestore contenuti per gestire raccolte e dataset? Aggiungi una tabella per mostrare un dataset in una comoda visualizzazione. Dalla definizione del comportamento alla personalizzazione del layout e del design, puoi personalizzare la tabella in modo che si adatti perfettamente al sito del tuo cliente.
In questo articolo, scoprirai come:
Prima di iniziare:
Aggiungi e configura la raccolta di contenuti che vuoi mostrare nella tabella.
Aggiungere e configurare una tabella
Aggiungi una tabella al sito del tuo cliente dal pannello Aggiungi elementi. Ci sono diverse tabelle predefinite tra cui scegliere, che puoi personalizzare completamente in base alle tue esigenze. Puoi quindi scegliere il dataset che vuoi mostrare nel pannello Ispezione.
Per aggiungere e configurare una tabella:
- Clicca su Aggiungi elementi
sul lato sinistro dell'Editor - Clicca su Strumenti layout
- Clicca su Tabelle
- Trascina il design che ti piace sulla pagina
- Collega la tabella a una raccolta di contenuti:
- Clicca sull'icona Collega al Gestore contenuti
- (Nel pannello Ispezione) Scegli il dataset che vuoi mostrare nella tabella
- Clicca sull'icona Collega al Gestore contenuti
- Clicca su Gestisci tabella e imposta le colonne della tabella:
- Riordina: clicca sull'icona Riordina
accanto alla colonna pertinente e trascinala verso l'alto o verso il basso - Modifica il nome della colonna: passa il mouse sulla colonna pertinente e clicca sull'icona Altre azioni
e seleziona Modifica etichetta. Inserisci il nuovo nome e clicca su Fatto - Elimina colonna: passa il mouse sulla colonna pertinente e clicca sull'icona Altre azioni e seleziona Elimina
- Gestisci connessioni: clicca su Gestisci connessioni per modificare i collegamenti del Gestore contenuti. Quindi clicca sui menu a tendina pertinenti sotto Connessioni nel pannello Ispezione per modificare i collegamenti e i link
- Riordina: clicca sull'icona Riordina
Personalizzare le impostazioni della tabella
Ottimizza la funzionalità della tabella dal pannello dell impostazioni della tabella. Scegli cosa viene selezionato quando i visitatori cliccano su una cella della tabella, decidi come si aprono i link e imposta il formato della data in base alle tue esigenze.
Per personalizzare le impostazioni della tabella:
- Vai al tuo Editor
- Seleziona l'elemento della tabella
- Clicca sull'icona Impostazioni
e scegli tra le seguenti opzioni:
- Selezione al clic: scegli ciò che viene selezionato nella tabella quando i visitatori cliccano su una cella: Nessuna, Righe o Celle
- I link si aprono su: se hai collegato elementi, scegli se aprirli in una nuova finestra o nella finestra corrente
- Formato data: se hai collegato un tipo di campo Data, scegli un formato in cui visualizzare le date
Lavorare con i punti di interruzione:
Le selezioni nel pannello Impostazioni si applicano a tutti i punti di interruzione.
Progettare una tabella
Dalla regolazione dei colori di riempimento e dell'opacità alla regolazione di bordi, angoli e ombre, hai il pieno controllo sull'aspetto della tabella. Puoi anche personalizzare lo stile del testo e la formattazione per renderla più elegante.
Per progettare una tabella:
- Vai al tuo Editor
- Seleziona la tabella pertinente
- Clicca sull'icona Apri Ispezione
in alto a destra dell'Editor - Scegli cosa vuoi personalizzare:
- Colore e opacità: scegli il colore di sfondo e l'opacità delle diverse parti della tabella (ad esempio Sfondo dell'intestazione, Sfondo riga, Sfondo tabella)
- Bordo: imposta il colore, le dimensioni e la larghezza del bordo della tabella, nonché i divisori
- Angoli: rendi gli angoli della tabella più arrotondati impostando il raggio (in px)
- Ombra: applica l'ombra nel colore, angolo e opacità che preferisci
- Testo: personalizza e formatta ogni parte del testo che appare sulla tabella (ad esempio Testo intestazione, Testo riga)
- (Facoltativo) Imposta i link nella tabella in modo che cambino colore al passaggio del mouse:
- Clicca su Passaggio mouse sotto Design
- Clicca sulla casella del colore accanto a Colore link a pass. mouse
Modificare il layout della tabella
Personalizza il layout della tabella in modo che si adatti perfettamente ai tuoi contenuti. Personalizza l'altezza della tabella, l'altezza delle righe e la larghezza delle colonne in base alle tue esigenze. Inoltre, puoi scegliere di mostrare o nascondere l'intestazione della tabella, regolare la direzione delle colonne e allineare il testo per una presentazione ottimale.
Per modificare il layout della tabella:
- Vai al tuo Editor
- Seleziona la tabella pertinente
- Clicca sull'icona Layout
- Scegli cosa vuoi modificare:
- Altezza tabella: decidi se il tavolo deve avere un'altezza personalizzata
- Larghezza colonna: imposta la larghezza delle colonne della tabella:
- Uguali: tutte le colonne occupano la stessa larghezza
- Personalizzata: clicca su Imposta larghezza per definire la larghezza di ogni colonna. Puoi utilizzare Pixel (px), Percentage (Percentuale) (%) o Automatico come unità di misura
- Mostra intestazione: clicca sull'interruttore per mostrare o nascondere l'intestazione della tabella (mostrando i titoli delle colonne). Quando l'interruttore è abilitato, puoi anche impostare l'altezza dell'intestazione
- Altezza riga: imposta l'altezza della riga in pixel
- Direzione: scegli se visualizzare le colonne da sinistra a destra o da destra a sinistra
Suggerimento: l'ordine delle colonne dipende dal modo in cui sono organizzate nel pannello Gestisci tabella - Allineamento contenuto: allinea il testo della tabella a sinistra, al centro o a destra
Lavorare con i punti di interruzione:
Le selezioni nel pannello Layout tabella si applicano a tutti i punti di interruzione.
Hai trovato utile questo articolo?
|