Come creare un grafico a torta in WordPress senza conoscenze di programmazione

show_pie_chart_in_wordpress

Mostrare un grafico a torta può essere utile per presentare diversi tipi di dati in una pagina web. Ma se non sei un programmatore o non hai abbastanza capacità di editing per i CSS, potrebbe essere impegnativo.

Non con ElementsKit, comunque!

Quando hai installato ElementsKit sul tuo sito web, puoi facilmente aggiungere un grafico a torta a una pagina web semplicemente trascinandolo.

In questo post del blog imparerai come creare grafici a torta in WordPress in pochi semplici passaggi.

Cos'è un grafico a torta?

Quando i dati vengono presentati graficamente con diverse sezioni in un cerchio è noto come grafico a torta. I dati e lo stile di presentazione possono variare, ma i dati saranno disposti in un cerchio grafico. A volte puoi personalizzare i dati della cerchia e inventare qualcosa di unico.

Come creare un grafico a torta in WordPress?

Crea un grafico a torta direttamente nella dashboard di WordPress utilizzando pochi semplici passaggi. Segui le linee guida che ho condiviso qui.

Passaggio 1: installa i plugin

Qui il nostro obiettivo è creare un grafico a torta in WordPress senza scrivere alcun codice. Quindi utilizzeremo i plugin più popolari Elementor Aggiungi su ElementsKit.

Per questo, vai al tuo Dashboard WordPress > Plugin > Aggiungi nuovo. Ora sul barra di ricerca superiore, cerca Elementor. Una volta trovato, installalo e attivalo.

Allo stesso modo, installa e attiva ElementsKit.

Passaggio 2: scegli le impostazioni del plug-in

È necessario configurare alcune impostazioni nel plugin ElementsKit. Per questo, vai sulla dashboard di WordPress e passa con il mouse su ElementsKit. Ora scegli "Widget" poiché creerai il grafico a torta con il widget Grafico a torta.

Dall'elenco dei widget, attiva il widget "Grafico a torta". Tuttavia, consiglierei di attivare tutti i widget per ottenere la migliore esperienza di creazione di pagine Web.

stile grafico a torta

Passaggio 3: crea una nuova pagina

Ora sei pronto per creare un grafico su una pagina web. Crea una pagina in cui desideri mostrare il grafico con i tuoi dati personalizzati. Oppure puoi selezionare una delle pagine esistenti.

crea una pagina e modificala con Elementor

Qualunque pagina selezioni per mostrare il grafico a torta, scegli "Modifica con Elementor" in alto a destra.

Ti reindirizzerà alla pagina dell'editor dove potrai utilizzare tutte le funzionalità di ElementsKit. 

Passaggio 4: aggiungi il widget Grafico a torta

Nel pannello laterale sinistro, cerca il widget Grafico a torta e trascinalo nella pagina.

Se lo desideri, puoi creare un particolare tipo di sezione prima di trascinare e rilasciare il widget sulla pagina.

Trascina e rilascia il grafico a torta

Per aggiungere una sezione, fai clic sull'icona più e aggiungi la sezione.

Passaggio 5: personalizza il grafico a torta

Per impostazione predefinita, ci saranno alcune preimpostazioni nel grafico a torta. Puoi personalizzare queste impostazioni con pochi clic.

personalizzare il grafico a torta

Nella scheda contenuto, puoi modificare lo stile del grafico a torta, il contenuto del grafico e la percentuale del grafico.

Stile grafico a torta: Qui puoi scegliere Semplice o Con contenuto.

Contenuto del grafico: In questa sezione puoi utilizzare la percentuale o un'icona per il grafico. Se scegli un'icona, mostrerà più opzioni per personalizzarla. Carica un'icona personalizzata per mostrarla sul grafico.

Percentuale: Qui puoi selezionare e impostare la percentuale per il grafico.

Successivamente, vai alla scheda Stile per applicare uno stile al grafico.

Dimensioni del grafico a torta: Se lo desideri, regola le dimensioni del grafico a torta. Puoi annotare la dimensione o trascinare la barra per aumentare o diminuire la dimensione.

Dimensione del bordo: Imposta qui la dimensione del bordo con la barra di regolazione.

Tipo di colore: Scegli un colore personalizzato per il grafico che desideri.

Colore barra: Aggiungi il colore della barra che si adatta correttamente al design della pagina.

Colore sfondo barra: Aggiungi un colore di sfondo al grafico a torta per renderlo migliore.

Colore icona: Se hai aggiunto un'icona per il grafico, qui puoi sceglierne un colore personalizzato.

Se desideri una maggiore personalizzazione, vai alle impostazioni avanzate e apporta le modifiche necessarie per rendere il grafico più facile da usare.

Passaggio 6: personalizza l'aspetto della pagina

Puoi personalizzare anche l'aspetto della pagina con Elementor. Per questo, nella parte superiore della sezione, c'è un pulsante tratteggiato. Fai clic su di esso e ti reindirizzerà alla scheda layout.

modifica il layout della pagina con Elementor

Avrai tutte le opzioni per personalizzare il layout della pagina.

Passaggio 7: anteprima e pubblicazione

Infine, se hai fatto tutto correttamente, controlla l'anteprima del Grafico a torta. Se sembra perfetto, premi il pulsante Pubblica.

Alcune risorse aggiuntive che vorresti leggere:

Come creare un sito web per un'agenzia di marketing digitale [Stile senza codice]

Come creare un sito web per un'azienda di pulizie in WordPress

Come creare una pagina carriera sul tuo sito WordPress

Come creare un grafico in WordPress per la visualizzazione dei dati

Perché dovresti utilizzare il grafico a torta sul tuo sito web?

I grafici a torta rendono le informazioni su un sito Web facili da comprendere. Usano colori e forme per mostrare percentuali e confronti, rendendo semplice per i visitatori comprendere dati complessi. Utilizzando i grafici a torta, puoi rendere il tuo sito web più interessante e aiutare le persone a comprendere meglio le informazioni.

Parole finali

Creare un grafico a torta non sarà un compito impegnativo per te. Usa semplicemente il potere. di ElementsKit. Come i plugin convenzionali, non è per un singolo tipo di attività. Puoi progettare un intero sito web solo con ElementsKit. Quindi, provaci e inizia a ottenere la forma perfetta per il tuo sito web.


Commenti

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *