Apparently, I’m on a Drang kick because I have just been getting all kinds of inspiration from his site during the last few days.
I’ve talked about Bigfoot before as a great and elegant way of making annotations on a site. Upon reading some Dr. Drang’s posts, I realized that he uses a snowflake icon, ❆, as his inline footnote placeholder. What a great idea! Considering the theme of this site, I decided to incorporate a Font Awesome flask, , as mine.
All I had to do was edit the bigfoot-default.css file as shown below: 1
|
36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
@font-awesome { font-family: FontAwesome; src: url(/wp-content/plugins/font-awesome-4-menus/css/font-awesome.css); } .footnote-button:before { content: "\f0c3"; position: absolute; bottom: 0.6em; left: 0; right: 0; display: block; font-size: none; color: black; font-family: FontAwesome; font-weight: normal; font-style: normal; line-height: 0; text-align: center; } |
You can find the full file here for reference.
-
I use the connotation of the word “all” lightly. It really took me about an hour and a half to figure it out. Let’s just say I’m still learning CSS…↩