Come aggiungere note a piè di pagina semplici ed eleganti nei post del vostro blog WordPress

Volete aggiungere note a piè di pagina ai vostri post sul blog WordPress?

Se state scrivendo un articolo che fa riferimento a una ricerca o contiene molte informazioni complesse, potreste voler utilizzare le note a piè di pagina nel vostro contenuto. Si tratta di piccoli segni numerati in un testo che forniscono un contesto aggiuntivo a una frase o a un paragrafo.

In questo articolo vi mostreremo come aggiungere note a piè di pagina semplici ed eleganti ai vostri post su WordPress, passo dopo passo.

Perché aggiungere note a piè di pagina ai post del blog WordPress?

Se gestite un blog educativo, pubblicate ricerche o vi occupate di notizie, le note a piè di pagina sono un ottimo modo per dare maggiore contesto ai vostri contenuti. Potete usarle per aggiungere commenti, evidenziare fatti importanti o inserire citazioni di fonti accademiche sul vostro sito web.

Una nota a piè di pagina appare in genere come un piccolo numero in apice all’interno del corpo principale del testo. Il contenuto vero e proprio della nota a piè di pagina è collocato in fondo alla pagina o appare come un tooltip per distinguerlo dal contenuto principale.

Ecco un esempio:

Oltre a fornire chiarezza e trasparenza ai lettori, le note a piè di pagina possono far apparire il vostro sito WordPress più professionale e affidabile. Dimostrano che avete fatto le vostre ricerche e che avete le fonti a sostegno delle vostre affermazioni.

L’editor di WordPress.org ha ora una funzione integrata di note a piè di pagina che potete facilmente utilizzare per inserire un contesto aggiuntivo.

Questa guida vi mostrerà come aggiungere note a piè di pagina di WordPress ai post o alle pagine del vostro blog utilizzando due metodi. Uno è l’utilizzo del blocco Note a piè di pagina nell’editor Gutenberg, l’altro è un plugin.

È possibile utilizzare i link sottostanti per passare a un metodo specifico:

Metodo 1: Aggiungere le note a piè di pagina di WordPress con l’editor Gutenberg

Questo metodo è più adatto a chi vuole usare semplici note a piè di pagina e non vuole installare un plugin per questo scopo.

Per utilizzare il blocco WordPress Footnotes, è necessario aprire l’editor di blocchi di Gutenberg per un post o una pagina nuova o esistente.

A questo punto, è sufficiente evidenziare una parola del contenuto a cui si desidera aggiungere la nota a piè di pagina. Nella barra degli strumenti del blocco, fare clic sulla freccia a discesa e selezionare “Nota a piè di pagina”.

A questo punto si verrà reindirizzati in fondo alla pagina, dove è stato aggiunto automaticamente il blocco Note a piè di pagina. Qui è possibile inserire le informazioni aggiuntive.

Inoltre, è possibile personalizzare il colore, la tipografia, le dimensioni e il bordo del blocco utilizzando le impostazioni del pannello di destra.

Ripetete questo passaggio per includere tutte le note a piè di pagina necessarie.

Quando si visualizza l’anteprima del sito WordPress, dovrebbe essere presente un collegamento a piè di pagina alla frase evidenziata in precedenza.

Se si fa clic sul collegamento ipertestuale, si arriva in fondo alla pagina con la nota.

Qui si può anche fare clic sulla freccia ipertestuale per tornare alla sezione in cui è assegnata la nota.

Sebbene questo metodo sia abbastanza semplice per i principianti, non offre molte opzioni di personalizzazione. Se state cercando altri modi per modificare l’aspetto delle note a piè di pagina, continuate con il metodo successivo.

Metodo 2: Aggiungere le note a piè di pagina di WordPress con un plugin

Un altro metodo per creare note a piè di pagina è utilizzare il plugin gratuito Modern Footnotes. A differenza del blocco Footnotes, offre molte più opzioni per modificare l’aspetto delle note.

Ad esempio, è possibile far apparire la nota a piè di pagina come un tooltip, oltre a informazioni aggiuntive in fondo alla pagina.

La prima cosa da fare è installare il plugin Modern Footnotes. Per maggiori informazioni sull’installazione dei plugin, consultate la nostra guida su come installare un plugin di WordPress.

Configurazione delle impostazioni del plugin Modern Footnotes

Una volta installato il plugin, è possibile andare su Impostazioni ” Note a piè di pagina moderne. Qui è possibile configurare le impostazioni delle note a piè di pagina in base alle proprie preferenze.

Esaminiamo una per una tutte le impostazioni.

Comportamento della nota a piè di pagina” consente di selezionare il comportamento della nota a piè di pagina quando il sito web viene visualizzato su un computer desktop.

È possibile far apparire la nota a piè di pagina quando il cursore passa sopra il tooltip o quando l’utente fa clic sul tooltip. In alternativa, la nota a piè di pagina può espandersi sotto il testo annotato.

La scelta dipende dalle vostre preferenze. Detto questo, la nota a piè di pagina si espanderà sotto il testo per impostazione predefinita sugli schermi mobili.

Inoltre, se necessario, è possibile selezionare la casella “Fai apparire il contenuto della nota a piè di pagina nel tooltip nativo del browser web quando si passa il mouse sul numero della nota”. Ciò significa che la nota a piè di pagina apparirà nel tooltip del browser anziché in quello del plugin quando il cursore passa sopra il testo.

Si consiglia di disattivare questa impostazione se si sceglie l’opzione tooltip per il comportamento della nota a piè di pagina sul desktop. In caso contrario, si avranno due tooltip per la stessa nota, cosa che i lettori potrebbero trovare fastidiosa.

Di seguito, si può anche scegliere di visualizzare l’elenco delle note a piè di pagina in fondo ai post. In questo modo, il lettore può vedere tutte le informazioni aggiuntive in un unico punto.

Si consiglia di attivare questa funzione anche quando il post del blog viene diffuso attraverso i feed RSS.

Scorrendo verso il basso, si può scegliere di inserire un’intestazione per l’elenco delle note a piè di pagina e di scegliere un tag di intestazione. Questo aiuta a separare il contenuto vero e proprio del post dalle note a piè di pagina. Si può scrivere qualcosa come Riferimenti, Note a piè di pagina, Citazioni o Informazioni aggiuntive.

Se si desidera aggiungere un CSS personalizzato per modificare il testo della nota a piè di pagina, è possibile inserirlo nella casella ‘Modern Footnote Custom CSS’.

Infine, è possibile personalizzare lo shortcode Modern Footnotes se non si desidera utilizzare la versione integrata. Assicuratevi di inserire lo shortcode senza le parentesi.

Una volta soddisfatti delle impostazioni, è sufficiente fare clic su “Salva modifiche”.

Aggiunta di note a piè di pagina con il plugin Modern Footnotes

Dopo aver configurato le impostazioni di Modern Footnotes, inseriamo alcune note a piè di pagina nel contenuto. Aprite l’editor dei blocchi per un post o una pagina nuova o esistente.

Ci sono due modi per aggiungere una nota a piè di pagina. Uno è quello di utilizzare uno shortcode, che è quello che consigliamo.

Per prima cosa, individuare la frase in cui si desidera inserire una nota a piè di pagina. Poi, proprio accanto a quella frase, digitate il seguente shortcode:

[mfn]Inserisci la tua nota a piè di pagina qui[/mfn]

Assicuratevi di sostituire il testo tra le parentesi con le vostre informazioni.

Suggeriamo inoltre di inserire lo shortcode all’interno dello stesso blocco della frase, proprio accanto al testo, senza spazi intermedi, come nell’esempio seguente. Altrimenti, la nota a piè di pagina potrebbe sembrare scollegata dal testo.

L’altro metodo consiste nel digitare il testo della nota a piè di pagina accanto alla frase a cui si vuole aggiungere la nota. Assicuratevi che non ci siano spazi tra il testo della nota e la frase.

Nell’esempio seguente, si vuole aggiungere una nota a piè di pagina contenente una citazione accademica per la frase che inizia con “Gli studi suggeriscono…”.

Quindi, evidenziare la nota a piè di pagina e fare clic sul pulsante con la freccia rivolta verso il basso nella barra degli strumenti. Quindi selezionare “Aggiungi una nota a piè di pagina”.

Lo svantaggio del secondo metodo è che può essere difficile tenere traccia di quali righe di testo hanno ricevuto una nota a piè di pagina e quali no, quando si modifica il contenuto. Per questo motivo consigliamo il metodo dello shortcode.

Quando si visualizza l’anteprima del post, si noterà che ora c’è un numero accanto alla frase. Se si utilizza l’opzione tooltip, la nota a piè di pagina apparirà così:

D’altra parte, la nota a piè di pagina apparirà sotto il testo se si utilizza la formattazione espandibile.

Ecco come appare quando si fa clic sul numero:

Infine, se si sceglie di visualizzare tutti i contenuti delle note a piè di pagina in fondo al post, è possibile scorrere verso il basso per trovarli tutti.

Dovrebbero trovarsi da qualche parte sopra la sezione dei commenti.

Suggerimento bonus: Usare i campi personalizzati di WordPress per aggiungere più informazioni ai contenuti

Oltre alle note a piè di pagina, un altro modo per fornire informazioni aggiuntive nei post e nelle pagine di WordPress è l’utilizzo di campi personalizzati.

I campi personalizzati di WordPress sono metadati utilizzati per inserire informazioni aggiuntive in un post o in una pagina. Ad esempio, se gestite un blog con più autori, potreste voler visualizzare i nomi dei vostri collaboratori sul post, non solo il vostro.

Se siete interessati ai campi personalizzati, date un’occhiata alla nostra guida WordPress campi personalizzati 101.

Vi mostreremo come aggiungere campi personalizzati utilizzando l’editor di blocchi e alcuni plugin, tra cui WPCode. Questo plugin offre un modo sicuro e semplice per aggiungere snippet di codice al vostro sito WordPress, anche se siete dei principianti.

Speriamo che questo articolo vi abbia aiutato a capire come aggiungere note a piè di pagina al vostro sito WordPress. Potreste anche dare un’occhiata alla nostra selezione dei migliori plugin tipografici per WordPress e alla nostra guida su come mostrare e nascondere il testo nei post di WordPress con l’effetto “toggle”.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.