How to make real footnotes
In a recent announcement on Everything TypePad, Ben Trott, the co-founder and Chief Technical Officer at Six Apart, announced that TypePad now had the ability to add footnotes…like this: some text with a footnote 1. Is THAT 1 really a “footnote” function? Of course not. Let me show you how to make footnotes that really are footnotes.
Superscript and Subscript
Looking behind the scenes, as far as I am able to tell, all TypePad has done is to add a text formatting button that turns normal font into superscript , which certainly goes a long way in helping to add footnotes, but that is not a footnote per se. In fact, this behavior is very easy to achieve using HTML code, by enclosing text in HTML tags as below:
which then will appear as such: SUPERscript, but that doesn’t make a footnote, does it? Even if you add a superscript in the post and at the bottom of the post, it still does not connect the two in any way.
Making a real footnote requires a little bit more: By using anchored text or “page jump” as WordPress calls it, you can make fully functional footnotes linking back and forth between post and footnotes.
At the bottom of this post I have created a section for footnotes. Using page jump and superscript I can jump back and forth between my footnotes and the post text.
Try yourself by clicking this footnote: . In the footnote section, click the link that says “Back to post”. See what happens…
Now THAT would be a true footnote function, and despite TypePad’s claims, this kind of behavior must still be implemented by hand-coding HTML in your post.
How to make footnotes?
Where you want to make the footnote, write the following in HTML view:
<a href="#X" id="refX"><sup>[FOOTNOTE]</sup></a>
Where you want to link back to the post text, write the following in HTML view:
<a href="#refX" id="X">BACK TO POST</a>
The “X” is only used for internal linking. You can replace that with a code of your own choice, e.g. “footnote1″ or “fn1″ or whatever, just remember to keep the “#” and the “ref”. “FOOTNOTE” can be a number or letter or whichever you use to designate footnotes. “BACK TO POST” can be a text of your own choice.
Now THAT makes a real footnote!
TypePad claiming that they now have footnotes is an exaggeration at best and a lie at worst. Real footnotes still require some coding. This post shows you how to do it.
I owe this little tip to a Norwegian site with a crash course in using WordPress.
Back to post 1 An example of a footnote. Note that “Back to post” is placed in front. The reason for this is that we in fact are linking to that textline from the footnote above, and the browser will only display some of the last lines before the “Back to post” link, so if we add that line after a footnote that is several lines long, it may not display the full footnote.