Documentazione WP Table Manager

introduzione

WP Table Manager è un'estensione di WordPress utilizzata per gestire tabelle HTML in WordPress con un'interfaccia simile a un foglio di calcolo. Viene fornito in un unico pacchetto, inclusi tutti i temi.

 

WP-Table-manager

 

Principali vantaggi:

  • Gestisci tabelle come in un foglio di calcolo
  • 6 temi inclusi
  • Completamente gestito da qualsiasi editor
  • AJAX risparmio automatico
  • Dati ordinabili sul frontend
  • Editor di stile di cella, linea, colonna
  • Ridimensiona linea e colonna con drag'n drop
  • Copia cella con drag'n drop
  • Copia la tabella completa in un clic
  • Formato celle HTML
  • Editor di codice CSS avanzato

 

I. INSTALLAZIONE WP TABLE MANAGER

1.1 Installazione

 

Per installare il nostro plugin devi usare l'installer standard di WordPress o decomprimere e mettere tutta la cartella in / wp-content / plugin.

 

install-wp-media-cartella

 

Quindi fare clic su attivare il plugin, per vedere il menu WP Media Folder appare nel menu di WordPress a sinistra.

WP Table manager è accessibile da un menu dedicato a sinistra o in un lightbox dall'editor. Hai anche i parametri nel menu "Configurazione".

 

1.2 Aggiorna il plugin

Per aggiornare WP Media Folder, è possibile utilizzare il programma di aggiornamento predefinito di WordPress. È anche possibile rimuovere e installare la nuova versione da un file .zip scaricato su www.joomunited.com. In ogni caso non perderai alcun contenuto perché tutto è archiviato nel database.

 

wptm-update

 

Assicurati di avere sempre l'ultima versione per evitare problemi di sicurezza e stabilità.

Per aggiornare la versione a pagamento, è necessario accedere al tuo account JoomUnited dalle impostazioni di WordPress: Impostazioni> Generale

 

link-conto

 

Quindi utilizzare il login e la password dell'account JoomUnited. Dopo un login riuscito, il pulsante diventa blu con un testo Disconnetti il ​​mio account JoomUnited

 

image9

 

Infine, puoi aggiornare tutti i plugin commerciali JoomUnited dallo standard di WordPress aggiornato.

 

II. USO COMUNE WP TABLE MANAGER

L'idea principale di WP Table Manager è di gestire tutte le tabelle dall'editor anche se si dispone di una visualizzazione plugin. WP Table Manager funziona su ogni editor WYSIWYG WordPress, sia per frontend che backend. Ad esempio puoi usarlo in un modulo WordPress personalizzato.
 

2.1 Gestisci le tabelle dall'articolo

 

table-manager-tasto

 

Quando WP Table Manager è installato, hai un pulsante di editor che viene visualizzato sotto il tuo editor. Fare clic su di esso per aprire la vista principale WP Table Manager.

Gestore tabelle in una lightbox aperta da un post:

 

image14

 

Quando vuoi inserire una tabella nel tuo editor usa il pulsante in alto a destra Inserisci questa tabella per inserirla nel tuo articolo. Quindi, la tabella si materializzerà con un'area grigia e un'icona simile a Excel.

 

image15

 

Se si fa clic sull'area, sul pulsante WP Table Manager verrà caricata nuovamente la tabella precedentemente aggiunta.

 

image16

 

Tuttavia, Gutenberg è l'editor predefinito in WordPress ora, quindi puoi dare un'occhiata a 2.7 Blocchi a Gutenberg

2.2 Gestire tabelle e categorie

Le tabelle sono classificate all'interno di categorie. Puoi avere tutte le tabelle che vuoi all'interno delle categorie.

Per creare una categoria di tabella, fare clic su Nuova categoria di tabella pulsante sull'intestazione del cruscotto. Per creare una nuova tabella basta fare clic su Crea pulsante tabella.

 

table-categorie

 

Nota: una categoria e una tabella predefinite sono già state create durante l'installazione del plugin

 

La categoria può essere gestita posizionando il mouse su di essa, sarai in grado di modificare il nome o eliminarlo.

 

nome-tabella

 

Per ordinare le categorie è possibile utilizzare la funzione di trascinamento.

 

tavolo-move

 

Mettendo il mouse sul titolo della tabella appariranno le icone per modificare il titolo della tabella, copiare la tabella (tutta la tabella compresi i dati e il modello) o cestinarla.

 

2.3 Edizione da tavolo

Per aggiungere dati nelle tabelle devi comportarti come se fossi in una diffusione. Fare doppio clic su una cella ti darà la possibilità di aggiornare il contenuto, un singolo clic per selezionare una / alcune celle (e per applicare lo stile per esempio).

 

image20

 

Per aggiungere linee o colonne, fai clic sul segno + sul bordo della tabella o usa il tasto destro del mouse!

 

aggiungere fila-line

 

Per copiare le celle puoi usare CTRL + C / CTRL + V (o la roba di Apple che fa la stessa J) oppure puoi anche posizionare il mouse nell'angolo in basso a destra della cella e portarlo nella direzione desiderata.

 

cell-copy

 

Nota che tutto ciò che fai viene salvato automaticamente con un messaggio in alto a destra

 

Hai la possibilità di annullare l'ultima modifica.

 

image24

 

WP Table Manager mantiene un backup della modifica che hai fatto ed è in grado di ripristinarlo.

 

image25

 

2.4 Edizione del contenuto avanzata

È possibile aggiungere contenuto HTML con un editor WYSIWYG all'interno di ogni cella. Seleziona una cella, nella parte destra Formato> HTML.

 

image26

 

Ora quando modifichi la cella, avrai dentro l'editor HTML. Immagine e HTML sono disponibili.

 

html-table-cell

 

Le celle possono anche essere unite. Seleziona 2 celle o più quindi fai un clic destro, un menu ti permetterà di fare la fusione.

 

image28

 

2.5 Importazione / esportazione di Excel e fogli di calcolo

Puoi importare ed esportare foglio di calcolo in WP Table Manager utilizzando il nostro strumento dedicato.

 

image29

 

Le tabelle possono essere importate da Excel o documenti di ufficio aperti. Il formato verrà rilevato automaticamente e importato. Si noti che verrà importata solo la prima pagina di Excel.

L'esportazione può essere eseguita in formato Excel 2003 o 2007.

 

image30

 

2.6 Shortcode

Ogni tabella ha il suo shortcode, puoi trovarlo a Più scheda sul pannello di destra. Quindi puoi condividere facilmente la tabella utilizzando lo shortcode, ad esempio: [wptm id = 8]

 

codice corto

2.7 Blocchi a Gutenberg

Puoi mostrare i tuoi tavoli o grafici nell'editor di Gutenberg ora. Questi due blocchi WP Table Manager sono WP Table Manager e WP Table Manager Chart.

Per visualizzare una tabella nell'editor di Gutenberg, fare clic su WP Table Manager pulsante nella categoria Widget. Apparirà un menu a discesa, quindi selezioni la tabella che vuoi mostrare in frontend.

 

add-table-block

 

È simile a un grafico, facendo clic su Grafico WP Table Manager pulsante nella categoria Widget. Quindi scegli un grafico nel menu a discesa.

 

aggiungere-chart-block

 

III. TAVOLI DI STILE

3.1 Formato

La scheda formato è disponibile nella parte destra dello schermo per impostazione predefinita. Contiene diversi parametri.

 

image31

 

  • Tipo di cella: predefinito o HTML. Il tipo predefinito consente di calcolare con esso l'HTML inserendo contenuti HTML come le immagini. Un editor WYSIWYG per ogni cella verrà implementato nella prossima versione, per il momento si aggiunge HTML nella cella.
  • Sfondo delle cellule colore: definizione del colore di sfondo, naturalmente

 

image32

 

I bordi e le opzioni dei caratteri possono essere applicati su celle singole o multiple

image33

 

La larghezza di righe e colonne può essere definita in pixel. Seleziona una colonna o una riga in qualsiasi punto della tabella e convalida le dimensioni.

 

3.2 Temi e opzioni di ordinamento

Nella scheda tabella, sempre nella parte destra, hai un selettore di temi. Basta fare clic su un tema per applicarlo.

L'applicazione di un tema sostituirà tutti i dati e lo stile all'interno della tabella. Quindi il modo per procedere è applicare un tema, quindi modificare i dati o creare il tuo tema, quindi duplicare le tabelle.

 

tema a scelta

 

La funzione "Stile automatico: ti aiuta a colorare la linea sul tuo tavolo con Stile dell'intestazione e Stile del piè di pagina opzioni. È possibile selezionare gli stili del modello o crearne di nuovi alle impostazioni del plugin.

 

image35

 

Il parametro ordinabile consente di effettuare l'ordinamento dei dati AJAX sul frontend.

 

image36

 

L'allineamento della tabella riguarda l'allineamento del div che contiene l'intera tabella, ad esempio il centro della tabella.

 

image37

 

Come opzione è disponibile anche una cella hightlight. È possibile abilitare questa funzione nella configurazione. È disabilitato per impostazione predefinita. È possibile selezionare la riga evidenziata e il colore e l'opacità dell'evidenziazione.

 

tavolo-clou

 

3.3 Aggiungi tooltip sulle celle

I tooltip delle celle devono essere attivati ​​dalla configurazione del plugin (Menu di configurazione). Dopo l'attivazione otterrai un pulsante nella parte inferiore della scheda del formato durante l'edizione della tabella.

image39

 

È possibile per una larghezza in pixel. Il tooltip di modifica ti porterà a un suggerimento con un editor per modificare il suggerimento.

 

image40

 

Aggiungi contenuto e salva, il gioco è fatto, il tooltip verrà visualizzato sul lato pubblico al passaggio del mouse.

 

image41

 

3.4 Congelamento di linee e colonne

Il congelamento di linee o colonne è disponibile in tavolo scheda. Puoi bloccare fino a 5 linee o colonne. Viene contato dalla prima riga / colonna.

 

image42

 

Per rendere il congelamento delle righe esiste un'opzione aggiuntiva che consente di correggere l'altezza della tabella (perché il contenitore della tabella potrebbe avere un'altezza infinita).

 

image43

 

Quando hai scelto la linea o la colonna da bloccare, sarai in grado di scorrere sul tuo tavolo e visualizzare sempre la linea o le righe fisse.

 

image44

 

3.5 Filtraggio dei dati della colonna

Un'opzione di filtro è disponibile di nuovo nella scheda tabella. Puoi attivarlo per abilitare i campi di filtraggio dei dati pubblici.

 

image45

Esempio di filtri:

 

reattivo-table-scroll

 

3.6 CSS personalizzati

Andiamo un passo oltre. Se sei un webdesigner con competenze css sarai in grado di aggiungere css in Più scheda Puoi aggiungere padding e border border sulla cella.

 

image47

 

Nota che se hai applicato un tema, alcuni CSS personalizzati verranno aggiunti automaticamente. Puoi comunque modificarlo, ovviamente.

 

Ancora sul Più scheda, clicca sull'abitudine Pulsante CSS per accedere alla versione css. Il codice CSS è colorato usando il codice mirror e può essere scritto in less CSS, funziona anche!

 

custom-table-css

 

Le celle, la linea, le colonne hanno le coordinate per identificarle e applicare css personalizzati su di esse. R è riga, C è colonna.

 

image49

 

3.7 tabelle di WordPress reattive

I miei tavoli sono reattivi o usano lo scroll su piccoli dispositivi?

WP Table Manager gestisce il design reattivo con uno strumento prioritario, come opzione. Per impostazione predefinita, la funzione reattiva è disabilitata, ci sarà un overflow (tuttavia, funziona benissimo su mobile).

 

reattivo-mode

 

La modalità reattiva è avanzata, puoi definire una priorità per nascondere le colonne su dimensioni mobili. Quando le colonne sono nascoste, verrà visualizzato un menu mobile con la casella di controllo per forzare la visualizzazione / occultamento delle colonne.
La dimensione della colonna è fissa durante l'edizione della tabella. Se la dimensione di tutte le colonne è troppo grande per il contenitore, avrai un overflow e sarai in grado di scorrere facilmente su dispositivi mobili.

Tabella con una pergamena (meglio per una piccola quantità di colonne)

 

reattivo-table-scroll

 

Tabella con colonna nascosta (meglio per una grande quantità di colonne)

 

57bb0cb0ac948

 

3.8 Tabella di download

Per condividere il tuo tavolo in pubblico, devi abilitare Pulsante di download opzione a Tabella sul pannello di destra. Il tipo di file sarà * .xlsx.

 

download-table

 

IV. CARTA DA TAVOLI

4.1 Creare una tabella con i dati

Dalla versione 2.0 hai ora la possibilità di aggiungere grafici all'interno dei tuoi contenuti. Prima crea una tabella con i dati per generare un grafico.

 

image50

 

Quindi fai la tua selezione per generare un grafico, qui tutta la tabella è selezionata, clicca su Aggiungi il pulsante grafico.

 

image51

 

Verrà generato un grafico, rispettando l'intervallo di dati che hai selezionato. Sulla parte destra è possibile selezionare il tipo di tabella. È possibile generare come grafico di cui hai bisogno da un set di dati.

 

image52

 

Il grafico verrà aggiornato dinamicamente per quanto riguarda la modifica dei dati nella tabella.

 

4.2 Parametri del grafico

Una volta aggiunto il tuo grafico, hai alcune opzioni sulla colonna di destra.

image53

 

Il "Cambia riga / colonna" è disponibile solo se hai selezionato solo numeri nel set di dati. Ti sarà permesso di cambiare i dati da colonna a riga.

Il parametro "Usa prima riga / colonna come etichette" consente di aggiungere un'etichetta al grafico

 

image54

 

Quindi hai le opzioni per impostare larghezza / altezza, allineare, colore al grafico.

 

V. EXCEL E GOOGLE SHEETS SYNC

5.1 Sincronizzare una tabella con un file di Excel

È possibile eseguire una sincronizzazione tra una tabella creata e un file Excel sul server (ovunque). Dal scheda destra denominata "Tabella", in basso hai un blocco per collegare un file Excel al tavolo.

 

link-to-Excel


Se tu fare clic sul pulsante Sfoglia, sarai in grado di selezionare un Excel ovunque sul tuo server, qui è un file caricato tramite il gestore multimediale (cartella / uploads).

 

link-excel-file-tavolo

 

Una volta che il file Excel è collegato alla tabella, puoi premere il tasto Recupera i dati pulsante per importare i dati dal file Excel.

Nota: Solo i dati saranno presi da Excel, non dagli stili, quindi lo stile globale della tua tabella rimarrà intatto durante l'importazione.

 

fetch-excel-dati

 

Attenzione: a seconda della memoria disponibile sul server, non sarà possibile importare file Excel di grandi dimensioni (ad esempio più di 1000 righe)

Quindi ecco il risultato di un'importazione di dati.

 

Excel-Google-sheets-sincronizzazione

 

5.2 Sincronizzazione con Fogli Google

WP Table Manager offre anche alcune possibilità di sincronizzazione di Fogli Google. Il tuo foglio Google deve essere pubblicato per essere sincronizzato. Quindi, per prima cosa, apri il tuo foglio fromm Google Drive e pubblicalo come pagina web utilizzando il Menu File

 

publish-web-google-sheets

 

Quindi avrai accesso al link del file Fogli Google, copia questo link.

 

link-scheda

 

E incollare Scheda "Tabella" WP Table manager

 

link-to-Excel

 

Hai finito! Ora puoi recuperare i dati per una sincronizzazione istantanea ed eseguire anche una sincronizzazione automatica. L'opzione di recupero dello stile è nel caso in cui desideri anche ottenere gli stili di fogli di lavoro di Fogli Google.

 

5.3 Sincronizzazione automatica di Excel e Fogli Google

Sopra il collegamento al file è anche possibile attivare una sincronizzazione automatica. WP Table Manager recupera automaticamente i dati a intervalli regolari.

Una volta attivato, viene visualizzata una notifica dopo il titolo della tabella.

 

google-sheet-sync-preavviso

 

Il ritardo di sincronizzazione può essere impostato nella configurazione globale WP Table Manager.

 

sync-periodo

 

 

VI. PARAMETRI WP TABLE MANAGER

6.1 Parametri

Per accedere a WP Table Manager, andare in WP Table Manager> Configurazione

Come opzione puoi definire:

  • Abilita i pulsanti Importa / Esporta
  • Esporta il formato del file
  • Abilita descrizione comando
  • Abilita il salvataggio automatico o attiva un pulsante di salvataggio manuale
  • Periodicità di sincronizzazione file
  • Carica il plugin su frontend
  • Ricostruisci il colore alternativo
  • Evidenziazione delle celle
  • Evidenzia il colore di sfondo
  • Evidenzia il colore del carattere
  • Evidenziando l'opacità
  • Formati di data
  • Posizione del simbolo
  • Simbolo / i di valuta
  • Simbolo decimale
  • Conteggio decimale
  • Mille simboli

 

image55

 

VII. WP TABLE MANAGER CONSIGLI E TRUCCHI

7.1 Calcolo

Hai un'implementazione di calcolo di base in WP Table Manager. Gli elementi disponibili sono:

  • SOMMA, CONTA, CONCAT
  • MIN, MAX, AVG
  • DATA, GIORNO, GIORNO, GIORNO360
  • OR, XOR, E

Per fare una somma, digita in questo modo: = SUM (A1; B2) o = SUM (A1: B2)

 

sum-calcolo

 

7.2 Ruoli dell'utente

La gestione della tabella è definita dai ruoli utente di WordPress che hanno la possibilità di eseguire alcune azioni specifiche. Tutti gli utenti in un ruolo Utente avranno le stesse autorizzazioni per quanto riguarda la gestione delle tabelle.
Per configurare l'accesso utilizzare il menu WP Table Manager> Ruoli utente.

 

user-roles-settings

 

Dopo che l'utente ha effettuato il login, avrà il privilegio di gruppo per gestire i file.

Puoi impostare il proprietario dell'utente per categorie e tabelle a Di Più scheda.

 

set-user-ruolo

 

VIII. TAVOLE DAL DATABASE

WP Table Manager consente di creare tabelle dalle tabelle del database.

Dall'amministratore, fare clic su WP Table Manager> Tabelle del database.

 

 

Quindi sarai in grado di selezionare tabelle e colonne dal tuo database. Selezionando il controllo è possibile selezionare diverse tabelle e colonne.

 

Database-selezione

 

Nella selezione della colonna è possibile definire un titolo personalizzato e un ordine predefinito per i dati nella tabella, quando visualizzati sul lato pubblico.

 

colonna titleandordering

 

Poi hai alcune opzioni e filtri da applicare alle tue tabelle:

  • Un livello di impaginazione predefinito (da utilizzare con una grande quantità di dati)
  • Numero di righe per l'impaginazione
  • Applica un filtro ai tuoi dati, ad es. una colonna può essere uguale, diversa ... da un valore definito
  • La possibilità di raggruppare alcuni valori nelle colonne

 

Database-table-options

 

Finalmente puoi vedere in anteprima e generare il tuo tavolo come qualsiasi altro tavolo.

L'unica differenza è che i temi non possono essere applicati sui tavoli ma puoi personalizzare tutto il display come in qualsiasi altra tabella.

 

Quando la tua tabella viene generata, avrai comunque accesso alla tabella Fonte del database e puoi ad esempio aggiungere la colonna "Stato" nella tua tabella a Fonte di dati scheda.

 

Database-table-generated