I wanted to let you all know that I'm one step closer to getting avatars supported on my site. Now, I am having issues with trying to be able to include Blogger avatars. Ultimately, this is what I wish to get to. But it may take me a bit longer. I have some ideas, no thanks to their published APIs.
For now, when you leave a comment, I can go ahead and display your website's favicon as your avatar. You ask, "What's a favicon?" It's that little picture that displays in address bar window, next to the website url. For example, if you opened up my site in Firefox, you should see my favicon, which consists of a small "w" and a large "V".
If you'd like to have your own little favicon displayed next to your comments, follow these steps:
- Find a favicon.ico that you really like, or
- Create a favicon from an existing image.
- A favicon needs to be square, and typically 16 pixels by 16 pixels. But the next step should take care of that. Just generate a version of your image that is square.
- Go to Favicons from Pics and upload your newly created image. This will create a favicon.ico of your own that you can preview on their site. If you like what you see, you can download the favicon in a zip file.
- Save the image to your desktop, or wherever. You're going to have to get this favicon.ico onto your site. But there are some caveats.
- If your site is hosted through your own service provider, you simply need to place this file in your website's root directory. For my sites, this is "public_html". But it does vary.
- If you are on one of those freebie hosted sites like Blogger and you don't have the ability to access your root directory, you can still have a favicon show up. But you'll have to upload the favicon.ico file to some picture hosting site like Photobucket or Flicker.
- Once you have the favicon.ico saved, you'll need to edit your template with the following lines:
- You'll have to change this to reflect the actual path to your favicon.
- That's it.
Now, if you're actually hosting a site on WordPress, there are some changes you'll have to make to your site in order to be able to display such icons next to your comments. You'll need to install a plug-in for Favatar support. The directions are pretty good there. So, follow them and you should be okay.
I wanted to display these favicons next to Username of those leaving comments. In order to do this, I had to make some changes to comments.php. Most notably, I had to figure out where in the comments' loop to place the additional code.
The easiest thing to do is to look for
-
<?php comment_author_link() ?>
This is the php code that fetches the name of the commenter. I wanted to display the favicon next to this username, so I placed the following snippet,
-
<?php comment_favicon(); ?>
just before it. This function works with the favatar plug-in you've hopefully installed and will get the actual icon. There is a little formatting issue with this. The icon and the username seem to get squished together. To fix this, I used the following
-
in between the two functions. This places a very definite html space between the output of each. A bit technical for most, but I can always walk you through it if you have questions.
Anyway, I hope you enjoy this new feature. And wish me luck on getting the Blogger Avatar code working.
15/01/2007 at 10:50 am Permalink
Yhanks for fixing mine for me!
15/01/2007 at 1:34 pm Permalink
WHAT IN THE HELL LANGUAGE ARE YOU SPEAKING? LOLOLOL Good lawd, chile, slow down! My brain short circuits on this stuff and all I hear is white noise.
I wanna cute little favicon, namely my feet picture
, so I guess I’ll have to at least try. Really, I’m not STUPID, but I dunno, maybe in my old age I’m dumbing down :/.
I don’t suppose I could throw the “bereaved” card and you do it for me, huh? Ummm…I don’t think you know about that….
15/01/2007 at 3:22 pm Permalink
Cool beans. I love these little icons.
15/01/2007 at 11:16 pm Permalink
Chelle: You’re very welcome. I hope you enjoy having avatars supported again.
Robin: LOL! I have no idea half the time.
So, adding support to TypePad isn’t so straight forward. So don’t worry about it too much. I can walk you through making changes.
EE: I’m glad you like it. It was neat to figure out. And I like the fact that it’s blog platform neutral.
16/01/2007 at 10:16 am Permalink
Testing…123 testing…
16/01/2007 at 10:18 am Permalink
It’s still the STUPID TypePad icon…wait a second…was I supposed to DO something to make my feet appear???? (You’re going to remove me from your e-life, aren’t you???)
16/01/2007 at 10:32 am Permalink
Robin: I looked at your site’s source and we still have to add those lines that tell the browser where your favicon is stored.
Do you remember the level of membership you have with them, i.e. basic, plus or pro?
And no I’m not going to remove you, Silly!
16/01/2007 at 11:49 am Permalink
That’s so cool! Thanks for the info. Once my head doesn’t feel so mushy I’m going to play around with that feature. I wonder if I can make a Tink that small…
16/01/2007 at 5:03 pm Permalink
Hey Tink, I went ahead and made the icon for you and sent the changes to place in your Blogger template. Let me know if you have any problems. I think you’ll like how the tink came out.
16/01/2007 at 9:26 pm Permalink
Real men don’t use avatars or favicons.
17/01/2007 at 6:10 am Permalink
LOL! You’re probably right David.
17/01/2007 at 7:44 am Permalink
And oh, may I add emoticons.
17/01/2007 at 12:12 pm Permalink
I’m here to test my new icon….
(Thank you again!)
18/01/2007 at 7:40 am Permalink
You are so very welcome Tink. It looks great on your site too!
10/02/2007 at 10:41 am Permalink
Ugh. I’ve been trying for weeks to find a host for the icon I want to use on my Mom’s site. But neither Flickr or Photobucket will support the graphic because it’s not a gif or jpg etc. Any ideas?