CHARTS
2

KeyTube Charts ti permette di creare e integrare facilmente grafici dinamici e animati all’interno del tuo sito WordPress.

Puoi generare grafici sia dal front-end (versione pubblica) che dal back-end (versione professionale e incorporabile tramite shortcode). Il tutto basato su Chart.js, con supporto per grafici a torta, istogrammi, linee e donut.

Perchè usarlo

Semplice ma potente – crea grafici professionali in pochi clic, senza scrivere una riga di codice.

Tutto integrato in WordPress – nessuna piattaforma esterna, nessun iframe: i grafici vengono renderizzati direttamente nel tuo sito.

Flessibilità totale – ogni grafico può essere personalizzato, duplicato o trasformato (torta → barra → linea → donut) con un solo parametro nello shortcode.

Interattivo e responsivo – grazie a Chart.js i grafici si adattano automaticamente a qualsiasi dispositivo e includono animazioni fluide.

Colori e dati dinamici – scegli colori con il color picker e aggiorna i dati in tempo reale, con anteprima live.

Ordina e gestisci facilmente – riordina le voci tramite drag & drop direttamente dal pannello di amministrazione.

Ideale per contenuti dinamici – statistiche, report aziendali, analisi marketing, progressi, sondaggi, comparazioni di performance.

Funzionalità principali

Crea facilmente grafici a torta, istogramma, linea e donut facilmente personalizzabili. Assegna colori, ordina le etichette tramite Drag & Drop, incorpora la versione animata sul tuo sito web tramite un semplice shortcode.

Documentazione

Shortcode flessibili

Puoi personalizzare facilmente i tuoi grafici tramite parametri opzionali nello shortcode. Ecco i parametri disponibili per personalizzare il tuo grafico:

idID del grafico salvato nel backend[keytube_chart id="12"]
widthLarghezza del canvas (px o %)[keytube_chart id="12" width="400"]
heightAltezza del canvas[keytube_chart id="12" height="300"]
titleSovrascrive il titolo originale[keytube_chart id="12" title="Vendite 2024"]
typeForza un tipo di grafico diverso da quello salvato (pie, bar, line, donut)[keytube_chart id="12" type="bar"]
colorsSovrascrive i colori originali (lista separata da virgole)[keytube_chart id="12" colors="#ff0000,#00ff00,#0000ff"]

Esempio pratico

Hai salvato un grafico a torta, ma vuoi mostrarlo anche come istogramma nella homepage:

[keytube_chart id="12" type="bar" title="Distribuzione vendite"]

Risultato → lo stesso dataset, ma visualizzato con un diverso tipo di grafico e titolo.

In arrivo (versione pro)

  • Esportazione in PNG / SVG
  • Salvataggio front-end e grafici pubblicabili via shortcode
  • Importazione dati da CSV / Google Sheets
  • Pannello di stile avanzato (colori, font, legende)
  • Nuovi tipi di grafici: Radar, Area, Scatter