How To Create Footnotes In WordPress Without A Plugin

I’d written earlier about how to create internal anchor links in WordPress to skip from one section of the page to another. From here, it’s just a couple more steps to creating footnotes, with a small change. Here’s how you do it.

1. Create the Footnote First with an HTML Anchor Link

Since we don’t have a specific tool to create footnotes, we have to do this manually. First, create the numbered footnote on the bottom with an HTML anchor as shown here:

In this example, I’m using the HTML anchor “first-footnote”, but I suggest you use something more descriptive if you later want to insert a footnote before the one you’re creating now.

2. Create the Numbered, Superscripted Anchor Text

The second step is to write the number of the footnote within square brackets and format it as a superscript. You can do this by selecting the text and choosing the “Superscript” option from the dropdown menu on the toolbar, as shown here:

Once you do this, select the anchor text again, and convert it into a link, using the HTML anchor link that you inserted in the first step like this:

Save your changes, and you’re done!

Here’s how the final post looks once it’s published:

You can see that the numbered footnote links to the anchor text that you specified. When someone clicks on it, the browser will snap the viewport to the footnote, and then they can return back to where they were by using the back button.

Are Footnotes Still Relevant on the Web?

Some argue that footnotes are an anachronism that we don’t need anymore. Particularly on the web, where you can use hyperlinks to directly link someone to a new page within the text itself, rather than cite the source in a footnote.

I agree that the use-case scenario for footnotes on the web has decreased, but there are still situations where I think they’re useful.

First, you might not want to send someone to another page entirely and force the browser to load a new page. It breaks the flow compared to just reading a quick footnote that instantly scrolls to a separate portion of the page and back. Others suggest that you’re better off including the extra information at the same pace as the text in such scenarios. But, depending on the situation, this might be a little too distracting. Particularly if you just want to cite a source, writing it inline within brackets might render the text incoherent, especially if you do it often.

So while deciding whether or not to use a footnote, ask yourself the following questions:

1. Is the footnote taking the user away to another page?
2. Can you easily and seamlessly include the footnote text in the main content?

If the answer to either of these questions is “Yes”, avoid the footnote and either create an in-text link to the destination page or include the footnote information in the main paragraph to flow with the rest of the content.

A good use-case scenario for a footnote is where you want to digress a little bit but don’t want to distract from the main point that you’re trying to make. Footnotes are great for small clarifications, asterixis, and “conditions apply” situations.

Another point is that footnotes create an impression of professionalism and research that are missing from most web pages these days. This might fit well with a certain type of audience and can increase your writing authority. Try it out and see if it works!