Molti vogliono sapere come \u00e8 stato creato questo tavolo della Premier League. Di seguito sono descritti i passaggi per creare tabelle di base, moderne e interattive utilizzando wpDataTables<\/a>.<\/p>\n Questa tabella si basa sulla skin Aqua. Sono state apportate modifiche rimuovendo il confine circostante. La tabella viene automaticamente ordinata in ordine crescente, in base alle informazioni nella prima colonna.<\/p>\n La formattazione condizionale per la colonna "#" \u00e8 la seguente:<\/p>\n Il CSS personalizzato \u00e8 il seguente:<\/p>\n I badge sono stati presi dalla seconda colonna. L’esempio per il Liverpool mostra come sono stati aggiunti i badge nella colonna di tipo "stringa":<\/p>\n Il CSS personalizzato definisce quindi le classi "badge-1" e "badge-1.t1":<\/p>\n Il posizionamento dell’immagine dello stemma del club \u00e8 scelto dalla seconda classe, come mostrato di seguito per tutti i club in classifica:<\/p>\n Le colonne successive sono riempite con numeri interi. L’ultima colonna contiene le statistiche di vincita\/perdita\/pareggio. Per arrivare al layout desiderato \u00e8 necessaria molta formattazione condizionale:<\/p>\n La formattazione dovrebbe essere applicata fino al numero 20. Questo \u00e8 l’esempio per il Liverpool:<\/p>\n I dettagli per ogni squadra saranno diversi. Tutte le altre informazioni si trovano nel CSS personalizzato:<\/p>\n Sono necessari alcuni lavori e modifiche per farlo sembrare esattamente lo stesso, ma in pratica \u00e8 cos\u00ec che \u00e8 fatto.<\/p>\n Se hai trovato interessante questa applicazione wpDataTables, dai un’occhiata anche ad alcune delle altre tabelle della sezione vetrina.<\/p>\n wpDataTables viene utilizzato per generare una rappresentazione grafica di dati statistici sotto forma di grafici.<\/p>\n In questo esempio, le criptovalute sono classificate in una tabella usando wpDataTables. Puoi aggiungere questa tabella crittografica al tuo sito.<\/p>\n Questa tabella pu\u00f2 essere utilizzata per il confronto dei prodotti. Ad esempio, se hai un sito partner, la tabella pu\u00f2 visualizzare le caratteristiche dei modelli di laptop pi\u00f9 diffusi.<\/p>\n wpDataTables viene utilizzato qui per creare un bollettino meteorologico di riepilogo mensile.<\/p>\n Il plug-in viene utilizzato per creare una tabella che mostra i dati finanziari per paese.<\/p>\n Questo stile di tabella funziona bene per un sito affiliato, come una libreria.<\/p>\n wpDataTables pu\u00f2 creare un elenco di fondi comuni di investimento, ordinati in base alle prestazioni.<\/p>\n wpDataTables viene utilizzato per mostrare la configurazione del driver.<\/p>\n Se lavori con le tabelle, ecco alcuni motivi per cui una licenza wpDataTables soddisfer\u00e0 le tue esigenze.<\/p>\n 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.<\/p>\n 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.<\/p>\n \u00c8 possibile sviluppare filtri individuali per il tuo set di dati. Questo \u00e8 molto utile per restringere i dati in una tabella di WordPress.<\/p>\n wpDataTables ha la possibilit\u00e0 di renderlo modificabile. Il contenuto delle tabelle di WordPress pu\u00f2 quindi essere modificato in linea o in una forma generata.<\/p>\n Il nostro plugin per le tabelle di WordPress ha una funzionalit\u00e0 simile alla formattazione condizionale in Excel. A seconda del loro contenuto, puoi evidenziare colonne, righe o singole celle.<\/p>\n 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.<\/p>\n wpDataTables risolve con successo diverse attivit\u00e0 per pi\u00f9 di 30.000 clienti ogni giorno. Ci\u00f2 include l’interazione con il database, rapporti aziendali, cataloghi, dashboard scientifici e molti altri.<\/p>\n wpDataTables \u00e8 stata una soluzione meravigliosa per noi! Siamo gi\u00e0 rimasti molto colpiti dalle capacit\u00e0 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\u00e0 non sono seconde a nessuno. wpDataTables \u00e8 semplicemente un ottimo prodotto.<\/p>\n<\/blockquote>\n -Sara Woodmansee, USA. Fotografo e mappatura geografica presso Geo1 \/ Aerial Filmworks<\/p>\n Da uno sviluppatore web e dal punto di vista del cliente, wpDataTables \u00e8 uno dei migliori plugin che ho incontrato. Non solo il prezzo \u00e8 buono, ma anche la funzionalit\u00e0 \u00e8 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\u00f9 facile e interessante.<\/p>\n<\/blockquote>\n \u2013 Nordine Benhamari, Regno Unito. Web Developer, Database Designer presso Thanet Volunteer Bureau<\/p>\n Se ti \u00e8 piaciuto leggere questo articolo su come creare il tavolo della Premier League, dovresti dare un’occhiata a questo sui plugin del generatore di tabelle di WordPress .<\/a><\/p>\n Abbiamo anche scritto di alcuni argomenti correlati come l’alternativa a DataTables<\/a>, la libreria di tabelle JavaScript<\/a>, i plug-in per le tabelle di WordPress<\/a>, come creare una tabella in WordPress senza plug-in<\/a>, come inserire una tabella nei plug-in<\/a> delle tabelle dei prezzi<\/a> di WordPress e WordPress .<\/p>\nCome creare la classifica della Premier League<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5d2deae4.jpg\")
<\/a><\/p>\n.wpdt-c .wpDataTablesWrapper table.wpDataTable tr.odd:hover td{background-color:#fffbf1 !important;}\n.wpdt-c .wpDataTablesWrapper table.wpDataTable tr.odd td.grey,\n.wpdt-c .wpDataTablesWrapper table.wpDataTable td.grey{background-color: #dcdcdc !important;border-left: 1px solid #dcdcdc !important;}\n.wpdt-c .wpDataTablesWrapper table.wpDataTable tr.odd td.blue,\n.wpdt-c .wpDataTablesWrapper table.wpDataTable td.blue{background-color: #0083c2 !important;border-left: 1px solid #0083c2 !important;}\n.wpdt-c .wpDataTablesWrapper table.wpDataTable tr.odd td.red,\n.wpdt-c .wpDataTablesWrapper table.wpDataTable td.red{background-color: #d6181f !important;border-left: 1px solid #d6181f !important;}\n.wpdt-c .wpDataTablesWrapper table.wpDataTable tr.odd td.lightblue,\n.wpdt-c .wpDataTablesWrapper table.wpDataTable td.lightblue{background-color: rgb(91,192,222) !important;border-left: 1px solid rgb(91,192,222) !important;}\n.white-text { color: #fff !important; }\n<\/code><\/pre>\n<span class=\"badge-1 t1\"><a href=\"<\/code><\/pre>\n.badge-1 {\u00a0\u00a0\u00a0 background-image: url(<\/code><\/pre>\n.badge-1.t1 {\u00a0\u00a0\u00a0 background-position: -250px -225px;}\n.badge-1.t2 {\u00a0\u00a0\u00a0 background-position: -250px -250px;}\n.badge-1.t3 {\u00a0\u00a0\u00a0 background-position: -275px -325px;}\n.badge-1.t4 {\u00a0\u00a0\u00a0 background-position: -150px -150px;}\n.badge-1.t5{\u00a0\u00a0\u00a0\u00a0\u00a0background-position: 0 -50px;}\n.badge-1.t6{\u00a0\u00a0\u00a0 background-position: -275px -200px;}\n.badge-1.t7 {\u00a0\u00a0\u00a0\u00a0\u00a0 background-position: -350px -75px;}\n.badge-1.t8 {\u00a0\u00a0\u00a0 background-position: -50px -125px;}\n.badge-1.t9 {\u00a0\u00a0\u00a0 background-position: -250px -125px;}\n.badge-1.t10 {\u00a0\u00a0\u00a0 background-position: -350px -250px;}\n.badge-1.t11 {\u00a0\u00a0\u00a0 background-position: 0 -200px;\n}\n.badge-1.t12 {\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 background-position: -350px -125px;}\n.badge-1.t13 {\u00a0\u00a0\u00a0 background-position: -100px -100px;}\n.badge-1.t14{\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 background-position: -50px -175px;}\n.badge-1.t15 {\u00a0\u00a0\u00a0 background-position: -250px -225px;}\n.badge-1.t16 {\u00a0\u00a0\u00a0 background-position: -325px -250px;}\n.badge-1.t17 {\u00a0\u00a0\u00a0 background-position: -75px -150px;}\n.badge-1.t18 {\u00a0\u00a0\u00a0 background-position: -25px -150px;}\n.badge-1.t19 {\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 background-position: -75px -225px;}\n.badge-1.t20 {\u00a0\u00a0\u00a0 background-position: -225px -100px;\u00a0\u00a0\u00a0 }\n<\/code><\/pre>\n![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5d3e0a87.jpg\")
<\/a><\/p>\n<div class=\"score-last-6\">\n<span class=\"score-last-one win\"><\/span>\n<span class=\"score-last-one win\"><\/span>\n<span class=\"score-last-one win\"><\/span>\n<span class=\"score-last-one win\"><\/span>\n<span class=\"score-last-one win\"><\/span>\n<span class=\"score-last-one win\"><\/span>\n<\/div><\/code><\/pre>\n.score-last-6 {\u00a0\u00a0\u00a0 margin:0 auto;\u00a0\u00a0\u00a0 border-collapse: separate;\u00a0\u00a0\u00a0 display: table;\u00a0\u00a0\u00a0 border-spacing: 3px 0;\nheight:11px;\nvertical-align: middle;\n}\n\n.score-last-one{display: table-cell;\u00a0\u00a0\u00a0 height: .7em;\u00a0\u00a0\u00a0 width: .7em;}\n\n.win {background: #0083c2;}\n\n.lose{background: #d6181f;}\n\n.equal {background: #dcdcdc;}\n<\/code><\/pre>\nTabelle statistiche con grafici<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5d4c45fd.jpg\")
<\/a><\/p>\nClassifica delle criptovalute<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5d5b2380.jpg\")
<\/a><\/p>\nCatalogo online di laptop<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5d6a53b8.jpg\")
<\/a><\/p>\nBollettini meteorologici<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5d7bf387.jpg\")
<\/a><\/p>\nResoconti finanziari<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5d8b81cc.jpg\")
<\/a><\/p>\nCatalogo libri<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5d9a6877.jpg\")
<\/a><\/p>\nFondi comuni di investimento<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5da9bac4.jpg\")
<\/a><\/p>\nCatalogo dei driver<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5db8e6a4.jpg\")
<\/a><\/p>\nUnisciti alla comunit\u00e0 di wpDataTables<\/h2>\n
\n
Crea tabelle e grafici WordPress reattivi<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5dcc2750.png\")
<\/a><\/p>\nCrea tabelle di grandi dimensioni<\/h3>\n
Filtri avanzati e opzioni di ricerca<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5dedc0ff.png\")
<\/a><\/p>\nModificabilit\u00e0<\/h3>\n
Evidenziazione delle celle<\/h3>\n
Crea grafici<\/h3>\n
![\"Come](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-198192-61e8b5e1cb8c7.png\")
<\/a><\/p>\nAlcune recensioni che abbiamo ricevuto nel corso degli anni<\/h3>\n
\n
\n