After thinking about doing something with favicons and links, I came up with this very simple jQuery Plugin that would allow all the internal links in your website to actually have your own favicon implemented on the left side of the link.
First of course, you will need jQuery, which you can always download on the jQuery website.
Then you will need the internalFavLink plugin.
Here are some screen shots:
DOM
Add to your DOM Call
RESULTS
Shown Results
So some things I thought about before adding this to the blog.
1. What if I don’t have a favicon? Well, then either create one from an image and use this favicon creator tool from Dynamic drive, add it to your site and you will be able to use this plugin.
2. What if my favicon is a .png and not an .ico file as in the plugin? This is simple as well, just find the code in the javascript file called favicon.ico and change it to yours.
3. What if I want the favicon to be after the link? This is also simple; in the plugin javascript, just change where it says “prepend” to “append”.
The plugin is very simple. So if anyone has any ideas on how to improve please let me know.
You can also see the Internal Favicon Link jQuery Plugin in action!
Tags: DOM, favicon, internal links, Javascript, jQuery, jQuery examples, jQuery populate, jQuery tutorial
Comment By: Snookerman
March 10th, 2009 at 4:46 pm
This is nice, but it would be much more practical if it could show the favicons of external sites.
Comment By: Rich
March 11th, 2009 at 8:55 am
Yes it would. I actually had that originally. Let me work on that and I will post it up on a blog. I just wanted it to be a little different and actually try to find some branding practice that could be associated with internal links.
Comment By: Snookerman
March 29th, 2009 at 3:01 pm
Great, I’ll be looking back here to see what you come up with. Good luck!
Comment By: Snookerman
April 10th, 2009 at 4:28 pm
I found just what I wanted: http://blog.liviuholhos.com/javascript/add-a-favicon-near-external-links-with-jquery
Comment By: Rich
April 13th, 2009 at 9:43 am
@Snookerman I actually just read that post this morning. sorry for the delay. Glad you found what you were looking for though.
Comment By: THAT Web Design Agency Blog | Web Design and Web Marketing» Blog Archive » jQuery THAT rocks – October 2009
September 22nd, 2009 at 10:05 am
[...] any more? let us know. Related posts:Internal Links with Favicon using jQueryRefreshing an element at a set time interval using jQuery and a sprinkle of AjaxA useful list [...]