TABELLE WORDPRESS:

• Vuoi sapere come inserire tabelle nel tuo sito WordPress, o in quello della tua azienda?
• Hai bisogno di utilizzare delle tabelle per ordinare i contenuti del tuo sito, o i prodotti del tuo E-commerce?

Allora ti sarà utile sapere come creare delle tabelle WordPress e come crearle responsive. Se ti occupi di digital marketing, avrai senz’altro bisogno di conoscere bene questo CMS (Content Management System), in quanto è il più usato al mondo.

In questa pagina, parleremo di come creare tabelle responsive in modo facile e veloce, utilizzando sia l’editor per le tabelle, sia i migliori plugin per le tabelle WordPress. Scopriremo come personalizzare le tabelle interattive, vedremo come importare una tabella Excel in WordPress e come adattarle alle proprie esigenze.

L’utilità delle tabelle WordPress

Cosa sono le tabelle WordPress responsive? Sono degli elementi grafici che consentono di presentare dei dati sul tuo sito in modo chiaro e sintetico. Inoltre, le tabelle possono serviread organizzare i contenuti, come ad esempio risultati statistici, o i prodotti di un E-commerce, facendo sì che le informazioni siano schematizzate in una griglia, e che quindi siano di immediata comprensione.
Responsive invece sta ad indicare che le tabelle sono leggibili da ogni schermo, perché si adattano in automatico e in proporzione alla risoluzione del device che l’utente usa per navigare il sito.

Ti sarà capitato, o ti capiterà senz’altro, di aver bisogno di mostrare in modo chiaro e semplice dei dati, o i risultati di una ricerca, affinché siano leggibili anche a chi non è un addetto ai lavori e le tabelle WordPress potranno essere di aiuto.

Pensa ad esempio di dover presentare un prodotto complesso: come potresti spiegare ai tuoi potenziali clienti che è utile e conveniente per loro acquistarlo, comunicando in modo istantaneo?

Le tabelle ti saranno utili, perché sono degli schemi che rendono la comunicazione più semplice e immediata.Il vantaggio di utilizzare tabelle WordPress responsive sta nel far trovare velocemente agli utenti quello che stanno cercando su un sito. Di conseguenza, aumentano le probabilità che gli utenti informati, secondo le loro esigenze, si trasformino più facilmente in clienti che convertano.

Creare delle tabelle sul tuo sito può essere molto utile nel caso in cui si gestisca un tuo E-commerce con WordPress, per presentare i prodotti in modo ordinato; o ancora nel caso in cui si rivendano dei prodotti sul proprio sito per conto di terzi.
Le tabelle WordPress permettono di mettere a confronto diversi prodotti, sia per le loro caratteristiche specifiche, sia per il prezzo.

Riassumendo, le tabelle sono:

• degli elementi grafici che arricchiscono i contenuti testuali
• degli strumenti molto validi quando si ha la necessità di presentare un concetto in modo schematico sul proprio sito
• dei contenitori che semplificano la comprensione delle informazioni.

Tabelle WordPress: come crearle responsive

Il responsive design

Con “responsive” si intende il design di un sito web che è adattabile e “leggibile” su tutti i device. Questa leggibilità deriva dal fatto che tutti i contenuti – font, immagini, moduli, tabelle – sono creati secondo una griglia che si adatta proporzionalmente alle dimensioni dello schermo da cui si sta consultando il sito. Oltre ad essere responsivo, un sito dovrebbe essere pensato e progettato “mobile first”, dunque tenendo in considerazione per prima la web usability sullo schermo più piccolo, per poi arrivare a quello più grande, cioè il desktop.

Inoltre, il vantaggio del Responsive Web Design sta nell’avere nel proprio dominio un unico codice HTML, che tramite il CSS riconosce la risoluzione dello schermo da cui viene consultato il sito, per determinare in che modo il contenuto debba essere visualizzato. In questo modo si garantisce agli utenti la miglior User Experience possibile.

Perché è importante avere un sito con contenuti responsive? Perché il numero degli utenti che naviga da mobile, nel Settembre del 2016, ha superato il numero di quelli che naviga da desktop e questa tendenza è in continua crescita. E dato che, “L’obiettivo di Google è offrire agli utenti i risultati più pertinenti e un’eccellente esperienza”, la scelta del responsive design è premiata come fattore di ranking e quindi in termini di posizionamento sulle SERP.
(Qui puoi consultare la guida di Google per ottimizzare il tuo sito mobile)

Perché creare tabelle WordPress responsive

Una volta compresi i concetti di responsive e di web usability, ti sembrerà più chiaro il motivo per il quale è fondamentale creare tabelle WordPress responsive. Infatti il responsive design non riguarda solo le pagine di un sito, ma anche i contenuti al loro interno.

Pensa alla cattiva esperienza di navigazione che avrebbero i tuoi utenti se provassero a leggere una tabella sul tuo sito con tutte le griglie spostate: i dati contenuti non sarebbero più così ordinati e di facile comprensione. E questo è proprio il contrario di ciò che si vuole ottenere se si creano schemi grafici con lo scopo di rendere la comunicazione con l’utente più semplice e immediata, rendendo più agevole la sua user experience.

Come creare tabelle WordPress responsive con l’editor

Ora passiamo alla pratica e vediamo insieme quali sono i passaggi da seguire per creare tabelle WordPress responsive.

Per iniziare ti consiglio il plugin TinyMCE Advanced, che consente di estendere gli strumenti di formattazione a tua disposizione nell’editor di default, tra cui un comodo pulsante “Tabella”.

A prescindere dal tema che hai scelto per il tuo sito, i passaggi da seguire, con questo editor per tabelle WordPress, sono gli stessi.

• Vai su Pagina => Aggiungi Nuova / o Articolo => Aggiungi Nuovo (oppure apri in “Modifica” una Pagina, o un Articolo già creati in precedenza).
• Posiziona in cursore nell’editor di testo, nel punto in cui vuoi inserire la tua tabella.
• Nella barra degli strumenti di formattazione, clicca su “Tabella”: ti si aprirà un menu laterale nel quale, con il cursore del tuo mouse, potrai scegliere in modo veloce e intuitivo quante celle vuoi che compongano la tua tabella, in altezza e in larghezza. Puoi scegliere da un minimo di 1×1, a un massimo di 10×10.
• Una volta scelto il numero di celle che andranno a formare la tua tabella WordPress, cliccaci sopra e la tabella sarà inserita dove avevi posizionato il cursore nell’editor testuale
• La tua tabella sarà molto piccola, clicca nell’angolo e trascina l’estremità per allargarla finché sarà delle dimensioni che preferisci.

Una volta creata la tua tabella WordPress, dalla voce “Tabella”, scorrendo il menu a tendina, con TinyMCE Advanced potrai facilmente personalizzare degli elementi:

In Proprietà tabella => generale
potrai scegliere:

• Larghezza e Altezza della tabella (unità di misura espressa in pixel)
• Per quanto riguarda le singole celle potrai intervenire sulla Spaziatura cella, sul Padding cella e sul Bordo (unità di misura espressa in pixel)
• Didascalia: potrai aggiungere altre informazioni alla tua tabella, come se fosse un’immagine.
• Allineamento: puoi decidere se allineare la tua tabella al centro, a destra, o a sinistra rispetto al testo in cui l’hai inserita.

In Proprietà tabella => avanzate
puoi personalizzare il colore del bordo della tabella WordPress, nonché il colore di sfondo

In Celle => proprietà della cella della tabella => generale
puoi modificare:

• Larghezza e Altezza delle singole celle (in pixel)
• Tipo cella (cella o cella dell’header)
• Ambito
• H AlignNessuno
• V Align

In Celle => proprietà della cella della tabella => avanzate
puoi customizzare sia il colore del bordo, sia il colore di sfondo

Infine, sempre nel menu a tendina che puoi aprire dalla tabella, cliccando sulle voci Riga/Colonna, potrai personalizzare gruppi di celle, oppure decidere se inserire una riga, o una colonna prima o dopo di altre, potrai tagliare e incollare elementi ovunque tu voglia all’interno della tabella.

I migliori plugin per creare tabelle WordPress responsive

Esistono moltissimi plugin per creare tabelle WordPress responsive, che inoltre permettono di personalizzarne la veste grafica, in modo da rendere le tabelle belle graficamente oltre che funzionali.

Vediamone 3 tra i più utilizzati:

• TablePress
• Automatic responsive table
• Ultimate Tables

TablePress

Per scegliere il plugin che fa al caso tuo, per prima cosa vai su Plugin => Aggiungi Nuovo e digita “table”. Ti apparirà una serie di plugin e, tra tutti, spiccherà sicuramente TablePress, con le sue 600.000+ installazioni attive. Verifica che la tua versione di WordPress sia compatibile con il plugin, in caso contrario ti basterà eseguire un aggiornamento di WordPress, che dura solo qualche minuto. Una volta installato il plugin ti basterà attivarlo nei plugin installati.

TablePress è un plugin gratuito che consente di creare e gestire tabelle sul tuo sito e inoltre consente di importare una tabella Excel in WordPress. Per utilizzarlo non sono necessarie delle conoscenze preliminari di linguaggio HTML, in quanto l’interfaccia è di intuitivo utilizzo. Una volta creata la tua tabella, basterà inserire lo shortcode generato dal plugin nella visione testuale del tuo editor di testo. Un altro vantaggio di TablePress è che consente di filtrare i dati contenuti nelle celle, o cambiare l’ordinamento dei dati, cliccando sull’intestazione delle colonne. Infine questo plugin, in modo semplice, consente di importare ed esportare dati nei formati: CSV, Excel, HTML.

Le tabelle WordPress create con questo plugin possono contenere qualsiasi tipo di dato e anche delle formule come quelle che si possono utilizzare nei fogli di calcolo di Excel. => qui un esempio 

Ti consiglio di vedere un tutorial sul blog Tiziano Fogliata, docente del corso WordPress and Web site creation di Digital Coach, in cui vengono illustrati i passaggi per creare e personalizzare le tue tabelle create con TablePress:

1. come creare una tabella WordPress con TablePress
2. i passaggi per importare un file CSV per creare una tabella
3. come personalizzare l’aspetto di una tabella con i CSS

Automatic Responsive Table