Footnotes for WordPress

Project Tip Jar

Your generous gifts make ongoing support and development for Footnotes for WordPress possible.

$0.00 donated in the past 6 months.

  • Author: Charles Johnson
  • License: GPL
  • Compatibility: WordPress 2.9, 3.0 and above
  • Status: Supported and mature. Tested for compatibility with new WordPress releases, bug fixes and compatibility updates released as necessary.

Download

Footnotes for WordPress is a simple plugin designed with a simple aim in mind: to make it dead-easy to include decently-formatted footnotes in posts and pages on your WordPress blog.[1]

The plugin includes three major components: (1) a PHP module which implements easy-to-use shortcodes for footnotes in FeedWordPress; (2) a small JavaScript module which allows JavaScript-enabled browsers to display the footnote in a small bubble that pops up over the footnote reference, for easy reading; and (3) a stylesheet and small collection of images, which control the default appearance of footnote references, the content of footnotes, and the content of footnotes when displayed inline. The plugin makes extensive use of CSS classes to determine the appearance of the footnotes, meaning that you can override it with your own favored appearance from within your WordPress theme’s stylesheets.

  1. [1]In fact, I am using the plugin on this installation of WordPress, so you can see what kind of output it produces right here.

Advertisement

Footnotes for WordPress 2010.0822 is now available

I’m happy to announce that a new and improved release of Footnotes for WordPress (2010.0822) is now available. This release ensures compatibility with WordPress 3.0, includes a minor bug fix that may be significant[1], and a couple new features that you may find of use. Briefly, here’s what’s changed:

  • Feature: I have added a new shortcode, [backref name="..." /], which allows you to refer back to an established footnote if you gave it a unique name. So, for example:

    This is footnoted.[ref name="source1"]Source 1[/ref]
    
    So is this.[ref name="source2"]Source[/ref]
    
    And this one comes from the same source as the first.[backref name="source1"]
    

    The third paragraph will include a footnote that points back to the first source.

    Props for suggesting this feature go to Jesse Taylor.

  • Feature: If you don’t like my default styling for the footnote list (each footnote in an individual box with a little header marking it as a note), you can now easily override it by supplying your own class for the list of footnotes. Here’s how:

    This is a test.[ref]Lewis (2000).[/ref]
    
    <h3>Notes</h3>
    
    [references class="compact" /]
    

    … which will produce the following HTML:

    <p>This is a test.<sup>[<a href="#test-n-1" class="footnoted"
    id="to-test-n-1">1</a>]</sup></p>
    
    <h3>Notes</h3>
    <ol class="compact">
    <li class="footnote" id="test-n-1"><strong><sup>[1]</sup></strong> Lewis
    (2000). <a class="note-return" href="#to-test-n-1">&#x21A9;</a></li>
    </ol>
    

    Since the default styling is based on children of ol.footnotes, those default styles will not apply, and you can apply whatever styles you wish to the class that you’ve created.

  • WordPress 3 Compatibility: JavaScript functionality to make floating note bubbles appear did not work correctly in WordPress 3.0 in the earlier version. The current version of the plugin has been tested, fixed, and confirmed to work on, versions of WordPress up through 3.0.1.

  • Bugfix: There was a bug, which has now been fixed, in the handling of unique ids, which could cause the plugin to break if you attempted to create more than one footnote section in your post:

    Test[ref]Source 1[/ref]
    
    [references /]
    
    Test 2.[ref]Source 2[/ref]
    
    [references /]
    

    In earlier versions, the use of [references /] would cause the unique IDs to reset, creating duplicate IDs and breaking the plugins. This should now be something you can pull off without a hitch.

Download and enjoy! As always, if you have any issues with the release, or if there is anything that you would like to see included in a future release, please use the comments form or drop me a line to let me know about it. And if you find Footnotes for WordPress useful, please remember that a small tip in the project tip jar goes a long way towards helping keep little projects like this up and running.

  1. [1]If you like to write long posts where you’d like to break up the footnotes into more than one section.

Now available: Footnotes for WordPress

I’m happy to announce the initial public release (2010.0306) of Footnotes for WordPress, a new open-source plugin for the WordPress blogging platform. Footnotes for WordPress is a simple plugin designed with a simple aim in mind: to make it dead-easy to include decently-formatted footnotes in posts and pages on your WordPress blog.[1]

The plugin includes three major components: (1) a PHP module which implements easy-to-use shortcodes for footnotes in FeedWordPress; (2) a small JavaScript module which allows JavaScript-enabled browsers to display the footnote in a small bubble that pops up over the footnote reference, for easy reading; and (3) a stylesheet and small collection of images, which control the default appearance of footnote references, the content of footnotes, and the content of footnotes when displayed inline. The plugin makes extensive use of CSS classes to determine the appearance of the footnotes, meaning that you can override it with your own favored appearance from within your WordPress theme’s stylesheets.

Installation: Installation is designed to be dead simple. Download the installation package, install the contents in the plugins directory of your WordPress website, and activate the plugin from within the WordPress Plugins control panel. The plugin should begin working automatically as soon as it is activated.

Usage: Shortcodes are based on MediaWiki’s syntax for footnotes. To create a footnote, you can use the following WordPress shortcode:

This text is footnoted.[ref]With this footnote[/ref]

The plugin will automatically generate a unique HTML ID for each footnote that you add. However, if you wish to set a specific HTML ID of your own, you can use the name="..." parameter:

You can make the plugin generate IDs
with different names.[ref name="any-id-you-please"]Any IDs you
please![/ref]

By default, the plugin will automatically place all footnotes at the end of your post. If you want to display the footnote content somewhere else in the post (for example, because you want to place it above a list of “see also” likes), you can do so using the [references/] shortcode:

This text is footnoted.[ref]With
this footnote.[/ref]
     
And our footnotes will appear here:

[references/]

<h3>See also:</h3>
<ul>
<li><a href="http://example.com/1/">Post 1</a></li>
<li><a href="http://example.com/2/">Post 2</a></li>
</ul>

Download and enjoy! As always, if you have any issues with the release, or if there is anything that you would like to see included in a future release, please use the comments form or drop me a line to let me know about it.

  1. [1]In fact, I am using the plugin on this installation of WordPress, so you can see what kind of output it produces right here.