How To Add a Twitter "Button" To Your Blog.

Recently I've been posting Buttons on my post that look like this:

If you've been wondering how I've been doing this, I'm going to show you how, and it's really quite simple!

I get most of my Buttons from Twitter Buttons. Right now I'm going to break down every part of thier code and show you how to modify it how you'd like.

First, let's take a look at the code: <a href="http://twitter.com/YourLink"><img src="http://www.twitterbuttons.com/images/ex/twitter-31a.png" title="By: TwitterButtons.com" width="212" height="69" /></a><br /><a href="http://www.speed-your-pc.com">Speed up your PC</a>

Does that look confusing? Well, it's really not.

First look at <a href="http://twitter.com/YourLink"> this is just the URL the button will link to, so obviously you'd change the YourLink to your Twitter username, or you can change the entire URL.

Now look at <img src="http://www.twitterbuttons.com/images/ex/twitter-31a.png" This is the link to the image where the button is coming from. If you wanted to make a YouTube button for example, all you would have to do is post the DIRECT link to the image. When I say DIRECT, this means that the window that the image is in MUST be blank except for the image you want to use. For example, this would not work, while this would.

Now let's peek at title="By: TwitterButtons.com" width="212" height="69" /> All this is, is the tag that appears when the mouse hovers over the image.

This width="212" height="69" /> is the size of the image, which should be modified accordingly.

Lastly is just a link that appears at the bottom of the imgage, which I deleate.

I have made a list of good Twitter Buttons here that you can use if you don't like the ones from Twitter Buttons.

Thanks for reading! Hope you learned something.

Comments

[Branden Flasch]

Very helpful article!! Thanks!