Sicuramente, sembrerebbe un’esperienza terribile con tutti i dati e la formattazione condizionale che avresti bisogno di aggiungere alle celle della tabella.

Sai come si dice che non esiste il maltempo, solo vestiti inadatti?

Lo stesso vale per la costruzione di una tabella meteorologica. Se non riesci a crearne uno, significa che non hai gli strumenti giusti per il lavoro.

In questo articolo, esaminerò la creazione di una tabella meteorologica con wpDataTables, il plug-in WordPress n. 1 per la creazione di tabelle e grafici.

Che tipo di tabella meteorologica possiamo creare? Bene, qualcosa del genere:

Sì, è uno screenshot davvero lungo. È possibile visualizzare la tabella meteorologica dinamica qui.

Per creare una tabella meteorologica come quelle che abbiamo presentato in precedenza, hai poche opzioni a seconda dei dati di origine.

1 Creare una tabella da zero

Se non disponi di una fonte dati puoi creare la tua tabella meteo da zero con l’opzione "Creazione tabelle manualmente" dove inserirai i dati manualmente.

Per iniziare a creare manualmente una tabella di dati, apri il pannello di amministrazione di WordPress, vai su wpDataTables -> Crea una tabella, scegli la terza opzione "Crea una tabella manualmente" e fai clic su "Avanti".

Ti verrà mostrato il passaggio della procedura guidata che ti aiuterà a creare la struttura della tabella in cui creerai 14 colonne: Periodo, Anno e tutti gli altri saranno i nomi dei mesi (Gen, Feb…). Per le colonne Periodo lascerai il tipo di colonna come "Stringa di una riga" e per tutte le altre imposterai il tipo di colonna "Intero" .

Al termine della configurazione della tabella, fare clic su "Crea la tabella". Si aprirà un menu a discesa con le opzioni "Apri nell’editor standard" o "Apri nell’editor simile a Excel" e il gioco è fatto. Viene creata la struttura della tabella. Ora inserirai i tuoi dati nell’editor Standard o in un editor simile a Excel.

2 Creazione di una tabella da un’origine dati

Se disponi di dati in un’origine dati come Excel, CSV, JSON, foglio di calcolo Google, XML, array serializzato PHP o in una tabella nel database (origine SQL), utilizzerai la seconda opzione nella procedura guidata della tabella.

Per iniziare a creare una tabella di dati collegata a un’origine dati esistente, apri il pannello di amministrazione di WordPress, vai su wpDataTables -> Crea una tabella, scegli la seconda opzione "Crea una tabella di dati collegata a un’origine dati esistente". e fare clic su "Avanti".

Dipende da quale fonte hai seguirai le istruzioni:

Per questa tabella, utilizziamo CSV come origine dati che puoi scaricare da qui. Sceglierai CSV come "Tipo di origine dati di input" e poi sul pulsante Sfoglia trovalo

la fonte che hai precedentemente scaricato e caricato sul tuo server. Fai clic su Salva modifiche, quindi wpDataTables leggerà il file CSV che hai caricato e verrà creata la tabella.

Dopo aver creato la tabella, con una qualsiasi delle due opzioni, puoi personalizzare e configurare la tabella di WordPress di cui hai bisogno.

Nel nostro caso, attiviamo prima l’opzione "Mostra filtri in un modulo sopra la tabella" nella scheda " Ordinamento e filtro " nelle impostazioni della tabella e quindi configuriamo i filtri avanzati per ciascuna colonna. Per la colonna Periodo, impostiamo "Seleziona filtro casella" e "Filtro numero" per tutte le altre colonne.

Quindi attiviamo l’opzione "Reattività" nella scheda "Visualizza" nelle impostazioni della tabella e nascondiamo tutte le colonne "Mese" per tablet e dispositivi mobili nelle impostazioni di ciascuna colonna o più velocemente nel pulsante Elenco colonne sopra la tabella.

Per personalizzare il colore dei dati della tabella utilizziamo la formattazione condizionale. Per la prima colonna, impostiamo la condizione che se la cella contiene 2, "Imposta classe CSS cella " su "testo blu-bianco".

Quindi creiamo quelle classi nel campo " CSS personalizzato" nella scheda " Personalizza" nelle impostazioni della tabella come questa:


.wpdt-c .wpDataTablesWrapper .wpDataTable-1 td.blue{ background-color: #0083c2 !important;}

.wpdt-c .wpDataTablesWrapper .wpDataTable-1 td.white-text{ color: #FFFFFF !important;}

Come questo:

Dove il numero 1 in .wpDataTable-1 è l’ID della tua tabella, quindi dovrai cambiarlo per la tua tabella

Per tutte le altre colonne, impostiamo le stesse condizioni per impostare colori diversi in base al valore nella tabella per la tabella della temperatura massima.

Per la seconda tabella “Bassa temperatura" utilizziamo lo stesso approccio della tabella “Temperature Maximus”, eccetto le condizioni in Formattazione condizionale. Poiché è il valore più basso della temperatura, utilizziamo queste condizioni.

Quindi creiamo quelle classi nel campo " CSS personalizzato" nella scheda " Personalizza" nelle impostazioni della tabella come questa:


.wpdt-c .wpDataTablesWrapper .wpDataTable-2 td.white-text{ color: #FFFFFF !important;}

.wpdt-c .wpDataTablesWrapper .wpDataTable-2 td.black-text{ color: #000000 !important;}

Dove il numero 2 in .wpDataTable2 è l’ID della tua tabella, quindi dovrai cambiarlo per la tua tabella.

Questo è tutto!

Ora quello che devi fare è apparire sulle tue pagine nel front-end. Come con qualsiasi altro plugin, utilizziamo gli shortcode per mostrare le tabelle sulle pagine o sui post degli utenti. L’aggiunta di codici brevi è molto semplice, soprattutto se stai utilizzando famosi page builder come Elementor, WP Bakery o Gutenberg.

Altri stili di tabella che puoi creare con wpDataTables

Sei interessato a creare qualcosa di più delle semplici tabelle meteorologiche?

Devi dare un’occhiata ad alcune delle altre tabelle dalla sezione vetrina.

Tabelle statistiche con grafici

wpDataTables viene utilizzato per generare una rappresentazione grafica di dati statistici sotto forma di grafici.

Classifica delle criptovalute

In questo esempio, le criptovalute sono classificate in una tabella usando wpDataTables. Puoi aggiungere questo tipo di tabella crittografica al tuo sito con alcune modifiche.

Catalogo online di laptop

Questa tabella può essere utilizzata per il confronto dei prodotti. Ad esempio, se hai un sito web in cui stai presentando e promuovendo prodotti, la tabella può visualizzare le caratteristiche dei prodotti più popolari.

Resoconti finanziari

Il plug-in viene utilizzato per creare una tabella che mostra i dati finanziari per paese. Ovviamente, può essere adattato per presentare diversi tipi di dati finanziari.

Catalogo libri

Questo stile di tabella funziona bene per un sito affiliato o un negozio di libri online.

Fondi comuni di investimento

wpDataTables può creare un elenco di fondi comuni di investimento, ordinati in base alle prestazioni.

Catalogo dei driver

wpDataTables viene utilizzato per mostrare la configurazione del driver.

Unisciti alla comunità di wpDataTables

Se lavori con le tabelle, ecco alcuni motivi per cui una licenza wpDataTables soddisferà le tue esigenze.

Semplifica il lavoro con tabelle e grafici.
wpDataTables è un plug-in per tabelle WordPress più venduto a livello mondiale con aggiornamenti rilasciati di frequente e un’ottima assistenza clienti.
Già più di 40.000 aziende e privati soddisfatti utilizzano wpDataTables.
Viene utilizzato in applicazioni di gestione dei dati finanziarie, scientifiche, statistiche, commerciali e di altro tipo.

Con esso, puoi creare tabelle e grafici WordPress reattivi

Le tabelle create con il plug-in wpDataTables sono intrinseche e completamente reattive. Non ci sono restrizioni quando si tratta di piattaforme o tipi di dispositivi.

Puoi creare tabelle di grandi dimensioni

I tavoli grandi non sono un problema. wpDataTables gestisce le tabelle con milioni di righe in modo rapido e affidabile. Il server MySQL elabora tutte le operazioni.

Filtri avanzati e opzioni di ricerca

È possibile sviluppare filtri individuali per il tuo set di dati. Questo è molto utile per restringere i dati in una tabella di WordPress.

Modificabilità

wpDataTables ha la possibilità di renderlo modificabile. Il contenuto delle tabelle di WordPress può quindi essere modificato in linea o in una forma generata.

Evidenziazione delle celle

Il nostro plugin per le tabelle di WordPress ha una funzionalità simile alla formattazione condizionale in Excel. A seconda del loro contenuto, puoi evidenziare colonne, righe o singole celle.

Molte opzioni di grafici

I dati nelle tabelle di WordPress possono essere utilizzati per generare grafici WordPress. Tre potenti motori vengono utilizzati per generare questi grafici, che vengono aggiornati in tempo reale.

Alcune recensioni che abbiamo ricevuto nel corso degli anni

wpDataTables risolve con successo diverse attività per più di 40.000 clienti ogni giorno. Ciò include l’interazione con il database, rapporti aziendali, cataloghi, dashboard scientifici e molti altri.

wpDataTables è stata una soluzione meravigliosa per noi! Siamo già rimasti molto colpiti dalle capacità del plug-in fin da subito. I plugin TMS hanno lavorato con noi per personalizzarlo in base alle nostre esigenze. Le personalizzazioni ci hanno permesso di creare un’interfaccia intuitiva per i clienti, per l’inserimento e la modifica dei dati. L’assistenza clienti e la reattività non sono seconde a nessuno. wpDataTables è semplicemente un ottimo prodotto.

-Sara Woodmansee, USA. Fotografo e mappatura geografica presso Geo1 / Aerial Filmworks

Da uno sviluppatore web e dal punto di vista del cliente, wpDataTables è uno dei migliori plugin che ho incontrato. Non solo il prezzo è buono, ma anche la funzionalità è perfetta. Estremamente facile da usare e molto ben progettato. Ha molte caratteristiche adatte a chiunque, dai principianti ai livelli avanzati. I video che completano il plugin sono spiegati in modo approfondito con molti esempi. Non posso sottolineare abbastanza quanto abbia reso il mio sviluppo web più facile e interessante.

– Nordine Benhamari, Regno Unito. Web Developer, Database Designer presso Thanet Volunteer Bureau

Se ti è piaciuto leggere questo articolo su come creare tabelle meteorologiche, dovresti dare un’occhiata a questo sui plugin del generatore di tabelle di WordPress .

Abbiamo anche scritto di alcuni argomenti correlati come l’alternativa a DataTables, la libreria di tabelle JavaScript, i plug-in per le tabelle di WordPress, come creare una tabella in WordPress senza plug- in, come inserire una tabella in WordPress e i plug-in delle tabelle dei prezzi di WordPress .

Fonte di registrazione: wpdatatables.com