WP Table Manager: stilizzazione delle tabelle
- 1. Formato
- 2. Temi e opzioni
- 3. Aggiungi descrizione comandi alle celle
- 4. Congelamento di righe e colonne
- 5. Ordina e filtra
- 6. Riempimento delle celle e raggio del bordo
- 7. CSS personalizzato
- 8. Tabelle WordPress reattive
- 9. Esporta in Excel
- 10. Paginazione
- 11. Stile del bordo delle celle
- 12. Stampa la tabella sul frontend
1. Formato
Sulla barra degli strumenti, puoi impostare lo stile per la cella come: carattere, dimensione del carattere, stile del testo, colore di sfondo per la cella, colore del testo, allineamento orizzontale e verticale della cella, ... Può essere applicato per una singola cella o più celle
È possibile selezionare la percentuale per l'editor di tabelle. Ciò significa che è possibile ingrandire o ridurre la tabella, con un intervallo dal 50% al 200%.
L'altezza delle righe e la larghezza delle colonne possono essere definite in pixel. Andare su Menu Formato > Applica dimensione colonna/riga, quindi selezionare Ridimensiona colonna / Ridimensiona riga. Nella finestra a comparsa, è possibile selezionare l'intervallo e impostare i pixel per colonne o righe. Fare clic sul Fine per terminare.
2. Temi e opzioni
In ogni tabella, puoi trovare di selezione del tema nel menu Tema. Basta cliccare su un tema per applicarlo.
Colori alternativi
Nella stessa sezione Tema del menu > Colori alternativi, la funzione "Stile automatico" consente di colorare la linea della tabella con dell'intestazione e del piè di pagina . È possibile selezionare gli stili predefiniti o crearne di personalizzati nelle impostazioni del plugin.
È possibile rimuovere il colore alternativo facendo clic "Rimuovi > Rimuovi stile automatico" nel menu contestuale (clic con il pulsante destro del mouse). Il colore verrà quindi rimosso dopo la conferma.
Allineamento della tabella
L'opzione "Allinea tabella" serve ad allineare il div che contiene l'intera tabella, ad esempio centrandola completamente. Puoi trovarla nel menu Formato > Allinea tabella.
Evidenziazione delle celle
È disponibile anche un'evidenziazione delle celle come opzione. È possibile abilitare questa funzionalità nella configurazione. È disabilitata per impostazione predefinita. È possibile selezionare la riga evidenziata per regolarne il colore e l'opacità.
3. Aggiungi descrizione comandi alle celle
Su ogni cella di una tabella, facendo clic con il pulsante destro del mouse, è possibile visualizzare l'opzione Aggiungi suggerimento.
Puoi impostare la larghezza del tooltip in pixel. Verrà visualizzata una descrizione comandi con un editor per le modifiche.
Aggiungi il contenuto e salva, il gioco è fatto, il suggerimento verrà visualizzato sul lato pubblico al passaggio del mouse.
4. Congelamento di righe e colonne
Congelamento a colonna
Il blocco delle colonne è disponibile nel menu Formato > Opzioni responsive. È possibile bloccare fino a 5 colonne. Il conteggio inizia dalla prima colonna.
Per bloccare riga/colonna è disponibile un'opzione aggiuntiva che consente di fissare l'altezza della tabella (perché il contenitore della tabella potrebbe avere un'altezza infinita).
Dopo aver scelto la colonna da bloccare, potrai scorrere la tabella e visualizzare sempre la colonna fissa.
Congelamento delle righe
È possibile trovarlo nel menu Formato > Intestazione tabella; da qui è possibile attivare l'opzione e impostare le righe da bloccare (fino a 5 righe).
Se vuoi impostare l'altezza del tavolo, torna alle opzioni Responsive.
Quindi la prima riga verrà bloccata sul frontend in base all'impostazione.
5. Ordina e filtra
Se desideri ordinare o filtrare la tabella, vai al menu Formato > Ordina e filtra .
Appare quindi un popup contenente le opzioni di ordinamento e filtro.
Per ordinare una tabella, è sufficiente abilitare "Ordinamento da frontend" . È possibile selezionare una colonna per l'ordinamento predefinito e la sua direzione.
Ad esempio, in questo caso, selezionare la colonna A con ASC .
Ci sono 2 opzioni per il filtro:
- All'interno della colonna: puoi filtrare i dati nell'intestazione di ogni colonna. Il pulsante di attivazione/disattivazione ti aiuterà a mostrare o nascondere il campo di ricerca nell'intestazione.
- Modulo di filtro avanzato: una volta selezionata l'opzione, è possibile cercare e filtrare i dati in una tabella
Ricerca principale: attivando questa funzionalità, verrà aggiunto un campo di ricerca nel frontend. Ciò consentirà agli utenti di cercare facilmente tra tutti i dati nella tabella.
6. Padding delle celle e raggio del bordo
Puoi trovare l'icona del bordo sulla barra degli strumenti che ti aiuta a regolare la spaziatura e il raggio del bordo sulla cella.
7. CSS personalizzato
Facciamo un ulteriore passo avanti. Se sei un web designer con competenze CSS, potrai aggiungere codice CSS in Formato menu > CSS personalizzato.
Il codice CSS è colorato utilizzando il codice mirror e può essere scritto con meno CSS, funziona anche così!
Celle, righe e colonne hanno coordinate per identificare ciascuna di esse e applicare ad essa un CSS personalizzato. R è la riga, C è la colonna.
8. Tabelle WordPress reattive
Le mie tabelle sono responsive o utilizzano lo scorrimento sui dispositivi di piccole dimensioni?
Nascondere Cols
WP Table Manager gestisce il design responsivo con uno strumento prioritario, come opzione. Per impostazione predefinita, la funzionalità responsiva è disabilitata e si verifica un overflow (che funziona comunque benissimo sui dispositivi mobili). Per utilizzare Nascondi colonne , è necessario andare su Menu Formato > Opzioni responsive.
La modalità responsive è avanzata e consente di definire una priorità per nascondere le colonne sui dispositivi mobili. Quando le colonne sono nascoste, viene visualizzato un menu mobile con una casella di controllo per forzarne la visualizzazione o la scomparsa.
La dimensione delle colonne è fissa durante la modifica della tabella. Se la dimensione di tutte le colonne è eccessiva per il contenitore, si verificherà un overflow e sarà possibile scorrere facilmente sui dispositivi mobili.
Tabella con scorrimento (migliore per un numero limitato di colonne)
Tabella con colonna nascosta (migliore per un gran numero di colonne)
Intestazione ripetuta
Questa è un'altra opzione se desideri inserire una tabella in uno spazio ridotto del tuo sito. Devi andare su Menu Formato > Opzioni responsive. Quindi seleziona Tipo responsive > Intestazione ripetuta.
Ci saranno opzioni da personalizzare in base alle tue esigenze:
- Punto di interruzione reattivo (px): seleziona un valore di punto di interruzione in pixel per definire quando la tabella passerà a questa modalità reattiva
- Altezza massima reattiva (px): quando la modalità reattiva è attivata, a seconda del valore del punto di interruzione, definire un'altezza massima per evitare una tabella molto lunga
- Stile modalità reattiva: applica uno stile predefinito per questa modalità reattiva o usa i colori della tabella
Dopodiché potrai vedere come apparirà la tabella nel frontend.
Se si utilizza l'intestazione ripetuta e Filtro è abilitata, è possibile filtrare digitando nella casella di testo nella visualizzazione mobile.
9. Esporta in Excel
Per salvare la tabella sul PC, vai al menu Tabellae clicca sul Esporta Excel . Il file sarà di tipo *.xlsx dopo l'esportazione sul frontend.
10. Paginazione
È possibile trovare questa funzione nel menu Formato > Paginazione in ogni edizione della tabella. Utilizzare il pulsante di attivazione/disattivazione per abilitarla e selezionare il numero di righe da visualizzare per pagina.
11. Stile del bordo delle celle
Puoi applicare diversi tipi di bordo alla tua tabella, come larghezza, colore e stile. Per prima cosa, seleziona l'intervallo di celle, quindi fai clic sull'icona nella barra degli strumenti.
12. Stampa la tabella sul frontend
A volte, è necessario stampare la tabella. Quindi, per visualizzare il pulsante Stampa sul frontend, per prima cosa, bisogna andare su Menu Tabella e selezionare il pulsante Stampa.




































