Friday, March 11, 2011

A Touch of Technology...

I have been working on a button for hours.  Silly, I know!  

I found a free photo editor online.  To created the graphics, I used Power Point. Once the button was how I desired, I uploaded the image to imgur.  The code below is what you'll need to create the linkable button. 

<center><a href="http://YOUR WEB ADDRESS/" target="_blank" title="BLOG TITLE"><img alt="BLOG TITLE" src="http://IMAGE WEB ADDRESS"/></a> <center></center><center><textarea id="code-source" rows="3" cols="13" name="code-source"><center><a href="http://YOUR WEB ADDRESS/"><img border="0" src="http://IMAGE WEB ADDRESS"/></a></center></textarea></center>

Don't forget to fill in the red, blue, and green components of the code with your web addresses and blog title.  To add a button to your sidebar, you'll need to open your account options in your blog design and add the html gadget. 

Pin It


S. Parker said...

I've been wondering how to do this for a while. Thought Ladybug would tell us how. You best her to it. Looks great! Have to get a new computer before I can make mine.

Happy weekend! :)

Mrs. Saoud said...

I hope Ladybug makes a post on creating a button. She most likely has a cool program to enhance the graphics and visuals to go along with her instructions. Folks like me need the differentiation! HINT HINT, CLUE CLUE! Like a fool, I tried over and over to take my fabulous header she created and turn it into a button. My creativity is limited!


First Grade Best said...

Thank you! I've been wanting to do this as well!

Mrs. Saoud said...

I guess I wasn't a fool. I played around with the image sizes until, SUCCESS! The image is a little smooshed but I am happy for now!!

Mrs. Lutton said...

You and I have too much in common!! I was struggling my way through making a button but bit the bullet and ordered one from The Cutest Blog on the Block. They whipped up a sassy one for me. It is a little large for now but I'm hoping they will shrink it down for me. Yours looks awesome!! Ladybug is too cool!


Thoughts of a Third Grade Teacher

sailingintofirstgrade said...

THANKS! The directions are clear and easy! I can't wait to make one! I can do it because you have empowered me! Thanks for making mine! You are one in a million and I appreciate you sharing!

Workshop Classroom said...

This post was very beneficial...thank you!!

Mrs. M said...

I have the immage put in but I don't have that nice white box under it. Is this part of that code?

Ms. Garber said...

Great! how do you post a button on your blog?

Mrs. Saoud said...

When posting a button, you will need to select design in the top right corner of your blog. Add a HTML gadget. You will need to copy and paste the modified code from above to save on your sidebar.

If you are posting the grab button in a post, you will need to select the Edit HTML tab above your post (instead of compose).

You will have a modified code if you do not want the grab box. Let me know if that's the problem.

Andi said...

I am failing! I've been able to add the little box with the code, but no image. I don't know where in the code I'm making my mistake. Any ideas?

Mrs. M said...

It took me awhile but I think I got it! Thank you for the help!

Andi - the problem I had was I had spaces where they shouldn't be. This was because I was cut and pasting. Hope you can get it.
Little Priorities

Gracehopper said...

Holy Moly! I did it! Thank you so much!


Pin It button on image hover