Putting Buttons on Your Blog

[Maw Books]

While cruising the blogosphere, I often see the "Follow Me on Twitter" buttons. If I can't remember if I indeed follow the blogger, I'll click over and view the profile. I have noticed that more often with the use of Twittericons.com buttons that the blogger will not complete all the steps to linking over to their profile. You must make sure that the url is twitter.com/XXXXX with XXXX being your username.

This reminded me that perhaps not everybody is fully aware of how to add buttons - any kind of button - to their blog.

When you are using somebody else's button, if they give you a code to copy, go ahead and copy and paste it on your blog. If they don't give you a code, download the pic to your own server or use a hosting service. Don't use their bandwidth by using the url on their hosting server/site. (There's a name for this - but I can't think of it.)

If you'd like to add the button on your sidebar

< a href= " URL TO WHICH YOU ARE LINK
ING IMAGE "< img src = " URL.gif " width =" XX " height=" XX " alt=" DESCRIPTION " title=" TITLE" / > < /a >

I have added spaces between most everything so the code wouldn't disappear on me.

Most times you may not need to specify width or height. Personally, I like my button to be the same size of my sidebars. So I add in the pixel dimensions. An alt description helps w/ search engines knowing what the image is. The title will bring up a box w/ title when button is hovered over.

And another hint: When using buttons in posts, most often a blogger will not link a url with it. If somebody clicks it, they will just go to the hosting site or url the image is hosted at. Why not take advantage and link them to somewhere that matters more? For instance, I link all my book images to Amazon, author photos to their website, and my many series buttons (author interviews, recipes, etc.) are linked to my archive of the subject. (Just in time for BBAW - link that button over to the site!)

At least this is how *I* do it. Please correct me if anything is wrong. I'm not on Blogger, so there could be a whole other way to do it there.

What would you add?

[Lexie]

the issue I run into the most is when I am given a specific code to use, it will not fit on my widget template half the time. when I go to fiddle with the height/width settings the button will either look ridiculously badly proportioned or the text on it will be unreadable.

the adding a link to the picture thing, I was doing that unconsciously for my own benefit, I never even thought it would help others honestly. I haven't added description words though, well I did during Bloggiesta, but for some god awful reason all my meta tags, website descriptions and such have vanished off the face of this earth! I'm gonna do a personal Bloggiesta in November anyhow tho

[Maw Books]

Often when I use a code given to me from someone else, I will not specify both height and width. I will just do width. I know my sidebars are 184 pixels wide. Specifying only one will usually readjust the height with no problem.

I have found that if it takes too long for the image to load from the other site, I'll go ahead and upload it to my own server.

[drey]

Great post, Natasha. One thing I do is if I have an image that only links to the image, I take out the link and the cursor pointer. That way you won't be able to click on it, and won't waste time going "nowhere"...

[Anysia]

"Don't use their bandwidth by using the url on their hosting server/site. (There's a name for this - but I can't think of it.)"

I think it is called both hotlinking and bandwidth theft. Definitely not something to do. :-)

[Ann Kingman]

In Blogger, there is no easy way to link a photo to a site without adding the html coding on the back end -- a true pain in the neck, so I don't do it. Just one more thing that makes me want to move to self-hosted WP, if only it weren't such an ordeal.