Thursday, October 20, 2011

How to Put a Button on Your Website

To put a button on your website, you need 3 images. First, you need to make a button using a photoshop tutorial. Save this button as Button.png. Next, use Hue/Saturation on photoshop to make the color a little different or brighter. Name this button Button 2.png. For the third image you'll need to use Bevel/Emboss to make the differently colored button look depressed. I used a downward pillow emboss but you can use whatever you think looks best. Finally, copy and paste this into your html source page:

<a href="put whatever url you want the button to take you to here"><img src="Button.png" onmouseover="this.src='Button 2.png'" onmouseout="this.src='Button.png'" alt="Click Me" border="none" onmousedown="src='D Button.png'"/></a>

*make sure that the backround is transparent for all of the button images (unless the shadow is showing from your Bevel/Emboss and you want to make the last one the color of your website backround).

5 comments:

  1. hey cat!! we miss you in class! hope you feel better soon :)

    ReplyDelete
  2. Cat, hope you get well soon :) I miss your blogposts and you being ahead of everyone else! See you soon! I'm sure you'll be able to get back ahead of everyone as soon as you come back

    ReplyDelete
  3. Hi Cat, hope you feel better soon! We miss you in class, im lost without you and your blog teaching me how to make buttons and everything.

    ReplyDelete
  4. thanks guys you're so sweet
    I'll see you in class tomorrow!

    ReplyDelete
  5. hey Cat, I hope you get this before the morning, but if you can bring me you laptop.

    ReplyDelete