Footnoting, similar to Wikipedia

  • Unknown's avatar

    I recognize that it may be necessary to switch themes, or even use a customized theme, to pull this look off.

    I’d like to have a class of anchors which act like footnotes; when I surround some text with an A tag from that class, I’d like a superscripted number to appear after the text, and that number would be a footnote which links to a footnotes section at the end of the article, where the user can click to learn more.

    Any suggestions?

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    @areyoutargeted,
    ...I'd like a superscripted number ...

    You can do it by adding “sup” HTML tag.
    Learn to do it here:
    http://www.w3schools.com/TAGS/tag_sup.asp

    An example:
    Example<sup>1</sup>

    where the user can click to learn more
    You can do this by using page jump.
    Learn to do it here:
    http://en.support.wordpress.com/splitting-content/page-jumps/

  • Unknown's avatar

    By the way, you don’t have to switch themes in order to do that.

    And you have a very cool idea there! :)

  • Unknown's avatar

    Before the actual list of footnotes appear you can put this bit of code to use the heading “Footnotes” and then separate it with a line (as in wikipedia)

    <strong>Footnotes</strong>
    <hr/>

    And to make the footnotes appear in rows, you have to put the footnotes in a table.
    You can learn how to make a table here:
    http://www.w3schools.com/html/html_tables.asp

    Or you can create a table online here:
    http://tablegen.nfshost.com/

    If you generate a table at the above url, the table they generate will have a table border.
    To make the table invisible to viewers, simply change the border of the table from 1 to 0
    The table border comes in the first line of code, which is this:
    <table border=1>
    If you change 1 to 0, it will be this:
    <table border=0>

  • Unknown's avatar

    Ummmm… I know my HTML, thanks.

    I’d like to be able to do this automatically, without having to hard-code footnote code into my articles/pages. Because I’m lazy, and I like computers to work for me, rather than the other way around.

    Like I said, I know I may have to switch themes to pull this off. Any suggestions?

  • Unknown's avatar

    It looks fine to me right now, well done!

    On an unrelated note: you might want to try reducing the number of posts that get displayed on each page. There are up to 50 fairly large images loading each time I view a page and that slows the load time down considerably. You could consider either reducing the number of posts, or use something like the more tag to show less of the photos on the main page.

  • Unknown's avatar

    Ignore that, I tabbed to the wrong window and pasted in an answer for someone elses question, oops.

    You could set up classes to superscript certain numbers using CSS however you’d still have to add in the HTML span tags to target these numbers and code in the footnote lists with the page jump links yourself. To have it done automatically would require you to modify the underlying code which we don’t get access to.

  • The topic ‘Footnoting, similar to Wikipedia’ is closed to new replies.