Add a button that links to a website to your blog

Step One: Upload the button
Using you ftp program (like coreftp.com ) upload the image to your website. If this was a logo of some website, the picture might be called “Logo.gif,” of “logo.jpg” or “logo.png” (you get the idea). The bottom line is you need to know the name of the file you are uploading, and the destination of where you are placing it.

Step Two: Verify the Location
If you uploaded “logo.gif” into the images folder of your server, the path would be www.yourdomainname.com/images/logo.gif  If you type that URL into a browser (changing the generic version to match your website and graphic) you should see the image appear. If it doesn’t you have either uploaded it to a different location, or typed in the address wrong.

Step: 3 Alter the Code
Here is a bunch of code, and I know it’s very geeky, but we will go through it line by line.

<a href="http://www.destination.com" target="_blank"><img width=125 height=125 border=0 alt="The pop up words" src="http:// www.yourdomainname.com/images/logo.gif  "></a>

 href=                     This is what website people will go to when they click this button. You might call this “The destination location.” So where it shows http://www.destination.com replace it with the website you want to link to (or in the case of iTunes or Zune, the link you want to have people use).

Target = blank     This is geek speak for, “When someone clicks on this it will open in a new window.”

<img width =         This is how big the button/banner you are using. Back in step two you brought the picture up in a browser. Now right click on it and choose properties. You will see its size represented. It will say Demensions followed by two numbers separated by an X. Substitute these two numbers into the code. In the example code the images is 125 X 125, but you do not have to use a button/banner that is 125X125.

alt =                        This is the “pop up” text that appears when someone holds their mouse over your button. You should put what it links to in this text.

src=                        This is where the image is on the internet (think of src as an abbreviation for “source.). change the code to reflect the image on your website.

Step 4: Copy the Code

Take your mouse and copy the entire code from the first “<” to the last “>’” (highlight it, right click on it and choose COPY).

Step 5: Paste The Code
Go to your website/blog and find the location where you want the image to appear. (You need to be looking at the CODE on your website). Click where you want the code to go, and then right-click and choose PASTE.

Step 6: Save Your Changes
Save the changes on your website/blog. If you are on a blog, you are done. If this is an html editor, you need to post your changes.

Step 7: View the Button
Go to your website/blog and view the button. Click on it and make sure it works and goes to the destination you specified.

Congratulations!

Dave Jackson

www.schoolofpodcasitng.com