Note a pié pagina (footnotes)

Su wordpress.com non esistono automatismi per creare note a pié pagina, né si possono installare plugins. Visto che la domanda mi è stata posta via mail, ho deciso di postare la risposta direttamente qui, anche se questo piccolo tutorial è applicabile a qualsiasi sito web e non necessariamente solo ai blog di wordpress.com.

Innanzitutto bisogna chiarire cosa s’intende per: “nota a piè pagina”. Si tratta di un link interno al post o alla pagina ad una riga di testo, di solito in fondo alla pagina, che contiene un commento o gli estremi di un testo citato. Quindi, prima di tutto, bisognerà crare un link che punta alla nota.

Poniamo che il testo della nota sia:

[1] Referenza

innanzitutto bisognerà darle un “nome” univoco con cui raggiungerla. Chiamiamola “nota1″. Il “codice” per affibbiare il nome alla nota sarà:

<a name=”nota1″>[1] Referenza</a>

A questo punto, per linkare la nota dal testo, basterà la sintassi:

<a href=”#nota1″>bla bla</a>

Cliccando su bla bla si “salterà” al testo: [1] Referenza.

Ora sarebbe bello poter avere un pulsante che ci riporti al testo che stavamo leggendo. Il procedimento è uguale, magari si potrebbe utilizzare addirittura un simboletto sempre uguale; HTML 4.0 offre un paio di possibilità, per esempio:

simbolo codice HTML
&uArr;
&crarr;
Λ &Lambda;

La nota potrebbe quindi diventare:

<a name=”nota1″>[1] Referenza</a> <a href=”#testo1″>&uArr;</a>

ed il testo:

<a href=”#nota1″ name=”testo1″>bla bla</a>

Se poi volessimo referenziare le note con apici (così; bla bla1), la sintassi diventerebbe:

bla bla<a href=”#nota1″ name=”testo1″><sup>1</sup></a>

Non rimane che separare le note a piè pagina visivamente dal corpo del testo. Per farlo basterà una riga (se il vostro tema non fa storie): <hr />.

Infine, con l’attributo title=”bla bla” inserito nel tag <a href=”…”… > si avrà un testo che appare quando il cursore del mouse passa sui link.

Assemblando il tutto:

   Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua1. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea2 takimata sanctus est Lorem ipsum dolor sit amet.


1. Nota
2. Nota

Pubblicato in pimp my blog. Tag: . 18 Commenti »

18 Risposte a “Note a pié pagina (footnotes)”

  1. chiaradavinci Dice:

    Santa subito!

    Questo metodo funziona alla perfezione, anche nei casi disperati (io sono dura di comprendonio e html-repellente).

    Grazie di cuore.

  2. isadora Dice:

    Chiara, ma grazie a te! :-)

  3. isadora Dice:

    Guardando la pagina con IE6 mi sono accorta che ⇑ e ↵ non sono supportati :-(
    Il resto, però, funziona…

  4. isadora Dice:

    Alla Megaditta, purtroppo sì… :-(

  5. silvana Dice:

    bella dritta, grazie!! il tutto va scritto all’interno del post?
    ciao

  6. isadora Dice:

    Silvana, il tutto va scritto là dove vuoi che appaia una nota a pié pagina… ma tu usi wordpress, quindi puoi usare il plugin WP-Footnotes

  7. valtellina Dice:

    grazie isadora, ho messo il plugin

  8. valtellina Dice:

    sono ancora io Silvana, mi ha loggato automaticamente :-)

    ho messo il plugin ma come faccio a decidere dove far iniziare la nota, me la mette in fondo alla pagina ma nel codice non vedo nulla ho già il testo scritto e in pratica volevo usare le note come ancore
    http://www.valtellinarte.it/archives/844

  9. isadora Dice:

    Silvana, io uso wordpress.com, quindi le note me le faccio a mano. A quanto leggo sul sito del plugin devi semplicemente mettere il testo per la nota fra parentesi doppie ((testo della nota)) di fianco al testo sul quale vuoi fare un’annotazione. Prova, altrimenti prova a chiedere su WordPress Italy.
    Comunque, visto che stiamo parlando di “note a piè pagina” non mi sorprende che il plugin le metta in fondo alla pagina…

  10. isadora Dice:

    Silvana, ora ho capito cosa stai cercando. È più semplice delle note a piè pagina e non c’è bisogno di plugin; guarda un po’ qui: I link interni o ancore e buon lavoro.

  11. silvana Dice:

    si le ancore le conoscevo pensavo con un plugin di prendere due piccioni con una fava come si dice..
    grazie ancora

  12. il blog di aleg » Blog Archive » Worpress e le note a piè di pagina Dice:

    [...] tutorial su usare.wordpress.com, da cui ho copiato il <sup>. Ottima spiegazione, semplice e dettagliata, ma… non mi [...]

  13. kOoLiNuS Dice:

    Isa, conosci un plugin per wordpress che lo faccia in “automagico” ?

  14. AnimAzzurrA Dice:

    GRANDE!!!!
    Sei grande!!!

    ;)

    Ma dimmi….come faccio ad inserire un’immagine fissa sotto la testata e una fissa a piè pagina di modo che ad ogni cambio di pagina restino tali, SEMPRE???

    A.A.A.

    • kOoLiNuS Dice:

      se parli del tuo blog personale, devi mettere mano al footer.php (se usi wordpress) perché il piè di pagina risulti sempre uguale … idem per la sezione della testata (che viene gestita da ciascun tema in maniera diversa)

  15. Lavoro a Domicilio Dice:

    Mettere mano inteso che bisogna creare le immagini e inserirle in un codice html che le rendi leggibili nel fotter.php

  16. Alfredo Dice:

    sei stato diabolico nella spiegazione perchè io mi sto avvicinando a questo settore ,credo informatica,con curiosità e molta ignoranza.quanto hai spiegato spero di ruscire a renderlo praticabilegrazie alfredo


Lascia un commento