Vuoi migliorare il posizionamento del sito e offrire una migliore esperienza agli utenti che lo visitano?
In questa articolo parleremo del Table of Content (TOC), l’ultimo widget inserito dagli sviluppatori di Elementor.
Dopo aver letto questo articolo avrai tutti gli strumenti per aumentare la leggibilità delle pagine e degli articoli del tuo sito o di quello dei tuoi clienti.
Sommario
Come sviluppatore di siti web mi trovo spesso ad aiutare clienti che mi chiedono di risolvere i problemi più disparati.
Per anni cercavo in rete come aiutarli e principalmente trovavo articoli di autori con competenze ma che non riuscivano alla fine a farmi capire come risolvere il problema.
Ho dunque creato questo blog per aiutare sviluppatori come me dando un valore pratico e non teorico per risolvere facilmente i problemi.
Sei pronto?
Partiamo!
Cosa è il Widget Table of Content o Sommario
E’ uno strumento che genera dinamicamente un elenco di collegamenti che collegano il tuo lettore alle diverse sezioni della tua pagina.
Questo Widget ti consente automaticamente di inserire in un indice i titoli dei paragrafi con cui è composto la tua pagina o il tuo articolo così aumentarne la leggibilità complessiva.
La creazione automatica di una gerarchia dei dei contenuti ti consente di ordinare i contenuti risparmiando tempo.
Vantaggi per gli utenti
Devi sapere che è statisticamente assodato che le persone hanno sempre meno tempo e vogliono ottenere immediatamente le informazioni che cercano.
La maggior parte delle persone che fa una ricerca su Google è alla ricerca di aiuto per risolvere un problema.
Arrivare su una pagina e non trovano quello che stanno cercando è molto frustrante, per questo costringerli a leggere l’intera pagina prima di trovare l’informazione che cercano aumenta il tasso di abbandono della pagina.
L’inserimento di un sommario aiuta gli utenti a trovare subito quello che stanno cercando aumentando contemporaneamente la soddisfazione degli utenti.
Un aumento della soddisfazione fa si che gli utenti tornino sul tuo sito e nel tempo aumenta la tua autorevolezza.
Vantaggi per la SEO
Uno dei fattori di miglioramento della SEO per quanto riguarda gli articoli di un blog è scrivere articoli molto lunghi.
L’utilizzo del Table of Content aiuta non solo, come abbiamo visto prima, gli utenti ma anche come Google vedrà la struttura della pagina.
Questi due fattori, il minor tasso di abbandono delle pagine da parte degli utenti e il miglioramento della struttura della pagina migliorerà anche il posizionamento del tuo sito su Google.
Ora che abbiamo visto la i vantaggi di questo Widget vediamo come configurarlo
Configurazione
Il Table of Content è disponibile solo per gli utenti che hanno una licenza Pro , questi utenti troveranno tra i widget il Table of Content.
Puoi inserire questo widget nel punto della pagina che preferisci , alcuni lo inseriscono all’inizio della pagina altri invece dopo il sottotitolo dell’articolo.
Passiamo adesso alle impostazioni.
la prima voce da impostare è il titolo del Widget, di default è inserito il titolo Table of Content ma puoi inserire il titolo che vuoi per esempio Sommario.
la seconda impostazione è il Tag html puoi lasciare quello di default
Adesso arriviamo alle impostazioni più importanti.
Quali titoli dei paragrafi includere nel sommario e cosa escludere.
Per fare ciò possiamo decidere in base ai tag html che hai utilizzato per i titoli.
Per esempio se per i titoli dei paragrafi degli articoli hai utilizzato un tag html h3 sceglierai solo h3 cancellando gli altri tag nel campo Anchor by Tags del widget.
L’impostazione container ti aiuta a limitare le voci del menu ad un contenitore specifico.
Se invece vuoi escludere qualcosa clicca su escludi e poi inserisci la classe CSS, che hai creato in precedenza, della parte che vuoi escludere nel campo Anchors by Selector.
Non sai come creare una classe CSS?
Non preoccuparti adesso ti mostro come fare
Ogni sezione, colonna o widget di Elementor nella Tab Avanzato ha un campo Classi CSS, ecco basta inserire in questo campo il nome che vuoi.
Ecco che hai creato una classe CSS!
Ricorda che le classi CSS sono sempre preceduti da un punto quindi quando userai la classe che hai creato nel campo Anchors by Selector dovrai inserire un punto (.) prima della classe per esempio .classe
Il campo Marker View ti consente di scegliere il tipo di elenco del sommario (puntato o numerato)
Nel menu Opzioni Aggiuntive puoi scegliere se attivare o disattivare
- il ritorno a capo automatico se il testo è troppo lungo
- La casella Riduci ad Icona
- la gerarchia dei titoli in base ai Tag
- Comprimere i submenu
Tab Stile
I controlli di stile ti consentono di scegliere come dovrà apparire il sommario nei tuoi articoli.
la prima impostazione che trovi è relativo all’intero box del sommario.
Le impostazioni all’interno di questo menu sono
- Colore dello sfondo
- Colore del bordo
- Spessore del bordo
- Raggio del bordo
- Rientro
- Altezza minima
- Ombra riquadro
Non mi dilungherò su queste funzioni perchè sono molto semplici da utilizzare
Con gli altri due menu della Tab Stile puoi modificare la Testata del blocco Sommario e la lista
Come usare questo Widget
Puoi usare questo widget se crei gli articoli con Elementor non se utilizzi Gutenberg (l’editor di testo di WordPress).
Questo problema si può aggirare, adesso ti spiego come.
Puoi creare con Elementor un template da usare solo per gli articoli.
In questo template su misura potrai utilizzare il widget Table of Content, una volta salvato ogni volta che crei un articolo con Gutenberg il menu verrà creato in automatico.
Non sai creare un template per gli articoli?
Te lo spiegherò in uno dei prossimi articoli
Questo widget è disponibile solo per chi ha la licenza Pro di Elementor
L’alternativa
Se vuoi creare un Sommario per i tuoi articoli puoi utilizzare il Widget di WordPress “Easy Table of Contents”
Questo plugin è lo stesso che ho deciso di utilizzare per i miei articoli perchè nonostante io abbia creato dei Template personalizzati per i miei articoli penso che questo widget di Elementor ha bisogno di qualche miglioramento.
Come funziona “Easy Table of Contents“
Innanzitutto devi scegliere dove dovrà essere inserito (Post, Pagine etc)
La seconda impostazione, invece, è molto importante perchè ti consente di scegliere se e dove inserire in automatico il Sommario.
Infatti è possibile inserire questo widget anche manualmente in un singolo articolo usando lo shortcode “ Sommario Sommario
Ci sono moltissime opzioni che ti aiuteranno a personalizzare il tuo menu dalla scelta di un punto specifico dell’articolo dove mostrare il Sommario alla scelta di mostrare il Sommario solo se ci sono un numero stabilito di Tag.
Anche in questo plugin puoi scegliere la gerarchia del sommario con i Tag, escludendo o includendo quelli che desideri.
Puoi anche impostare la dimensione del sommario, dei font, il colore etc
Siamo arrivati alla fine di questo articolo, come vedi puoi creare il Sommario che desideri migliorando l’esperienza dei tuoi lettori e il posizionamento del tuo sito.
Spero che ti sia di aiuto, ci vediamo nei commenti.
A presto!