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

Hai mai visto siti web con piccoli numeri in apice nel testo che rimandano a informazioni aggiuntive in fondo alla pagina? Quelle sono chiamate note a piè di pagina e sono un ottimo modo per fornire contesto aggiuntivo o citare fonti senza ingombrare il contenuto principale.

Alcuni dei nostri lettori ci hanno chiesto come aggiungere note a piè di pagina ai loro post di WordPress, specialmente quando scrivono contenuti ricchi di ricerche o articoli che necessitano di citazioni.

In questo articolo, ti mostreremo come aggiungere note a piè di pagina semplici ed eleganti ai tuoi post del blog di WordPress, passo dopo passo.

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

Se gestisci un blog educativo, pubblichi ricerche o copri notizie, allora le note a piè di pagina sono un ottimo modo per dare più contesto al tuo contenuto. Puoi usarle per aggiungere commenti, evidenziare fatti importanti o inserire citazioni di fonti accademiche sul tuo sito web.

Una nota a piè di pagina appare tipicamente come un piccolo numero in apice all'interno del corpo principale del tuo testo. Il contenuto effettivo della nota a piè di pagina viene quindi posizionato in fondo alla pagina o appare come un tooltip per distinguerlo dal contenuto principale.

Ecco un esempio:

Oltre a fornire chiarezza e trasparenza ai tuoi lettori, le note a piè di pagina possono rendere il tuo sito WordPress più professionale e affidabile. Dimostrano che hai fatto le tue ricerche e hai le fonti a supporto delle tue affermazioni.

Fortunatamente, l'editor di WordPress.org dispone di una funzione integrata per le note a piè di pagina che puoi facilmente utilizzare per inserire un contesto aggiuntivo. In questo modo, non dovrai aggiungere manualmente le note a piè di pagina.

Questa guida ti mostrerà come aggiungere note a piè di pagina in WordPress ai tuoi articoli del blog o pagine utilizzando due metodi. Uno è utilizzando il blocco Note a piè di pagina nell'editor di Gutenberg, l'altro è con un plugin.

Puoi utilizzare i link sottostanti per passare a un metodo specifico:

• Metodo 1: Come aggiungere note a piè di pagina in WordPress senza plugin
• Metodo 2: Come aggiungere note a piè di pagina in WordPress con un plugin
• Scopri altri modi per personalizzare i tuoi contenuti WordPress

Metodo 1: Come aggiungere note a piè di pagina in WordPress senza plugin

Questo metodo è ideale per chi desidera utilizzare semplici note a piè di pagina negli articoli del blog e non vuole installare un plugin per farlo.

Per utilizzare il blocco Note a piè di pagina di WordPress, dovrai aprire l'editor a blocchi di Gutenberg per un articolo nuovo o esistente.

Successivamente, puoi iniziare ad aggiungere blocchi di paragrafi, immagini e altri tipi di contenuto all'articolo del blog. Puoi persino aggiungere lettere maiuscole iniziali per stilizzare il tuo testo e catturare l'attenzione dei lettori.

Ora, evidenzia semplicemente una parola nel tuo contenuto a cui vuoi aggiungere la nota a piè di pagina. Nella barra degli strumenti del blocco, fai clic sulla freccia a discesa e seleziona 'Nota a piè di pagina'.

Verrai ora reindirizzato in fondo alla pagina, dove il blocco Note a piè di pagina è stato aggiunto automaticamente. Qui puoi inserire le tue informazioni aggiuntive.

Inoltre, puoi personalizzare il colore del testo del blocco, la tipografia, le dimensioni e il bordo utilizzando le impostazioni nel pannello di destra.

Se ci sono collegamenti nella nota a piè di pagina, potresti voler cambiare il colore dei collegamenti per farli risaltare.

Sentiti libero di ripetere questo passaggio per includere tutte le note a piè di pagina necessarie.

Quando visualizzi in anteprima il tuo sito WordPress, dovrebbe esserci un collegamento alla nota a piè di pagina nella frase che hai evidenziato in precedenza.

Se fai clic sul collegamento ipertestuale, verrai portato in fondo alla pagina con la nota a piè di pagina.

Qui puoi anche fare clic sulla freccia collegata per tornare alla sezione in cui è assegnata la nota a piè di pagina.

Potresti anche voler visualizzare il tuo sito web su dispositivi mobili per assicurarti che la nota a piè di pagina sia leggibile sugli schermi degli smartphone.

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

Metodo 2: Come aggiungere note a piè di pagina in WordPress con un plugin

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

Ad esempio, puoi 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, consulta la nostra guida su come installare un plugin WordPress.

Nota: Se non sei sicuro se utilizzare questo plugin, puoi installarlo sul WordPress Playground temporaneo e provarlo.

Configurazione delle impostazioni del plugin Modern Footnotes

Con il plugin installato, puoi ora andare su Impostazioni » Modern Footnotes. Qui puoi configurare le impostazioni delle note a piè di pagina secondo le tue preferenze.

Esaminiamo ogni impostazione una per una.

'Comportamento nota a piè di pagina desktop' ti consente di selezionare come dovrebbe comportarsi la 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 tue preferenze. Detto questo, la nota a piè di pagina si espanderà sotto il testo per impostazione predefinita sugli schermi mobili.

Oltre a ciò, puoi anche selezionare la casella 'Fai apparire il contenuto della nota a piè di pagina nel tooltip nativo del browser web quando passi il cursore sul numero della nota a piè di pagina' se necessario. 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. Altrimenti, avrai due tooltip per la stessa nota a piè di pagina, il che potrebbe infastidire i lettori.

Di seguito, puoi anche scegliere di visualizzare l'elenco delle note a piè di pagina in fondo ai post. In questo modo, il lettore potrà vedere tutte le informazioni aggiuntive in un unico posto.

Potresti anche voler abilitare questa funzionalità quando il post del blog viene syndicato tramite feed RSS.

Scorrendo verso il basso, puoi scegliere di inserire un'intestazione per il tuo elenco di note a piè di pagina e scegliere un tag di intestazione per essa. Questo aiuta a separare il contenuto effettivo del tuo post del blog dalle note a piè di pagina. Puoi scrivere qualcosa come Riferimenti, Note a piè di pagina, Citazioni o Informazioni aggiuntive.

Se desideri aggiungere del CSS personalizzato per modificare il testo della nota a piè di pagina, sentiti libero di inserirlo nella casella 'Modern Footnote Custom CSS'.

Ultimo ma non meno importante, puoi personalizzare lo shortcode di Modern Footnotes se non vuoi usare quello integrato. Assicurati di inserire lo shortcode senza le parentesi quadre.

Una volta che sei soddisfatto delle impostazioni, fai clic su 'Salva modifiche'.

Aggiungere note a piè di pagina utilizzando il plugin Modern Footnotes

Ora che hai configurato le impostazioni di Modern Footnotes, inseriamo alcune note a piè di pagina nel tuo contenuto. Apri l'editor a blocchi per un post o una pagina nuova o esistente.

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

Per prima cosa, trova la frase a cui vuoi aggiungere una nota a piè di pagina. Quindi, proprio accanto a quella frase, digita il seguente shortcode:

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

Assicurati di sostituire il testo tra le parentesi quadre con le tue informazioni.

Suggeriamo inoltre di inserire lo shortcode all'interno dello stesso blocco della frase, proprio accanto al testo, senza spazi tra loro, proprio come nell'esempio seguente. Altrimenti, la nota a piè di pagina potrebbe apparire disconnessa dal testo.

L'altro metodo consiste nel digitare il testo della nota a piè di pagina accanto alla frase a cui si desidera aggiungerla. Assicurati che non ci sia spazio tra il testo della nota a piè di pagina e la frase.

Nell'esempio seguente, vogliamo aggiungere una nota a piè di pagina contenente una citazione accademica per la frase che inizia con 'Gli studi suggeriscono...'

Successivamente, evidenzia la nota a piè di pagina e fai clic sul pulsante a freccia verso il basso nella barra degli strumenti. Dopodiché, seleziona '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 sta modificando il contenuto. Ecco perché raccomandiamo il metodo dello shortcode.

Quando visualizzi in anteprima il post del blog, vedrai che ora c'è un numero accanto alla frase. Se utilizzi l'opzione tooltip, ecco come apparirà la nota a piè di pagina:

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

Ecco come appare quando fai clic sul numero:

Infine, se scegli di visualizzare tutto il contenuto della nota a piè di pagina in fondo al post, puoi scorrere verso il basso per trovare tutto lì.

Dovrebbero trovarsi da qualche parte sopra la sezione dei commenti.

Scopri altri modi per personalizzare i tuoi contenuti WordPress

Oltre alle note a piè di pagina, ci sono molti modi per rendere i tuoi contenuti WordPress più interessanti e leggibili per i visitatori.

Ad esempio, puoi aggiungere font personalizzati a WordPress. In questo modo, puoi creare una tipografia che appaia unica e diversa dagli altri concorrenti, rendendo il tuo sito web più memorabile.

Inoltre, puoi evidenziare determinati testi nei tuoi blocchi di testo per attirare l'attenzione degli utenti sulle informazioni più importanti.

Un'altra cosa che puoi fare è visualizzare un'anteprima live dei tuoi link interni o esterni quando i visitatori ci passano sopra con il mouse mentre navigano nei tuoi contenuti. È un modo semplice ma coinvolgente per visualizzare che tipo di pagina vedranno se cliccano sul link.

Ecco altri suggerimenti che puoi consultare:

• Come evidenziare i nuovi post per i visitatori di ritorno in WordPress
• Come aggiungere contenuti dinamici in WordPress (Guida per principianti)
• Come aggiungere un ridimensionatore di font in WordPress per l'accessibilità
• Come aggiungere la modalità scura al tuo sito WordPress (Facile)
• Come visualizzare le etichette nutrizionali in WordPress

Speriamo che questo articolo ti abbia aiutato a imparare come aggiungere note a piè di pagina al tuo sito WordPress. Potresti anche voler leggere le nostre scelte esperte per i migliori page builder drag-and-drop per WordPress e la nostra guida su come modificare un sito WordPress.

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.