All About Kimberly

Sailing Along the Life of Single Parenthood

How To Put A “Grab My Button” Link on Your Blog

I’ve seen these all over the place – you know where they show you a picture of their button and then in a little scrolly box underneath, you can copy and paste the html language on your blog so that you can insert their button, linked to their site on your blog. In particular I’ve seen this on contest blogs where you can earn an extra entry to their contests if you place their button on your site. I got this great idea that I would add this to my blog since I had created the button for MomDot, but it proved a bigger challenge than I expected.  I consider myself a pretty good web searcher, but I simply could not find instructions for this. The problem? I simply didn’t know what these were called so I had no idea what to search for.  I finally stumbled upon instructions though, and it’s now here!  Yep – look over at the left side of my blog, and you’ll see my handy dandy “Grab My Button” thingy! (yea, even after finding instructions and creating it, I still don’t know what to call it.)

Since I had such a hard time finding it, I wanted to be sure to share the process with my readers in case you are wanting to add this to your site.

How to Add “Grab My Button” To Your Sidebar (or even a web post)

**These instructions include the HTML language for this task.  In WordPress, you could type this into a post in the HTML view or add to your sidebar by adding a textbox and including the entire code. If you use something other than WordPress, I’m not sure where’d you would place this code, but you should still be able to use the code whereever you can post html code and have it shown on your site**

Step 1: Add a picture of you button (so people know what they are grabbing)
To do this, you’ll create and upload your button either to your blog images file or an outside source such as photobucket.  You’ll need to know the exact location of your image.  You probably know this code, but just in case, the HTML for inserting the button linked back to your site:

<div align=”center”>
<a href=”http://www.YOURWEBSITE.com” target=”_blank”><img src=”http://www.THELOCATIONOFYOURBUTTON.jpg”></a>
</div>:

For an example, this is what mine looks like:

<div align=”center”> <a href=”http://www.allaboutkimberly.com” target=”_blank”><img src=”http://www.allaboutkimberly.com/wp-content/uploads/2008/07/aakbutton.jpg”></a> </div>

Step 2: Adding a Text Box with the Code for your Button
This is where I was running into problems. I didn’t realize it was a text box/area. The code looks almost identical to the code you used above except you have to surround it with the text box/area html <form><textarea>. A complete example:

<div align=”center”>
<form><textarea rows=”6″ cols=”19″ readonly=”readonly”><a href=”http://www.YOURWEBSITE.com” target=”_blank”><img src=”www.THELOCATIONOFYOURBUTTON.jpg”></a></textarea></form>
</div>

The command rows and cols defines how large the box will be. You can change these numbers as you see fit to adjust the size of your text box. The first number (rows) defines how tall the box will be, and the second number (cols) defines how wide the textbox is. The next part (readonly) is optional. You could delete the entire command and it would still function; however, I chose to include it as it prevents someone from accidentally hitting a button and changing the code during the copy/paste process. The <ahref….> is what actually appears in the text box.  Here is my actual instructions:

<div align=”center”>
<form><textarea rows=”6″ cols=”19″ readonly=”readonly”><a href=”http://www.allaboutkimberly.com” target=”_blank”><img src=”www.allaboutkimberly.com/wp-content/uploads/2008/07/aakbutton.jpg”></a></textarea></form>
</div>

When you put all of this together, this is how it looks,

All About Kimberly

Pretty simple, huh?  I thought so.  If any of this isn’t clear when you go to apply it, please let me know. I’d be glad to help (and modify my instructions for future users).

Reference: Tricks for New Bloggers

July 4, 2009 Update: Having Problems?  If you are having problems making this work, you are free to contact me, but try this first!  Copy and paste code into Notepad BEFORE you paste into your site.  It is important that the quoatation marks (“) go straight up and down – not at an angle.  I can not figure out how to under the angles on this page so you may have problems copying and pasting straight from it.  If you paste to a text editor like Notepad first, you should be ok.

Leave a Comment »

Trackback | RSS 2.0

1. Catherine (60 comments.) - July 30, 2008

Thank you for writing these instructions! After you made my 2 buttons I was going to email you again and ask how to do the cool text box thingy. I will add this tonight when I get home from work to my blog.

2. Kimberly (101 comments.) - July 30, 2008

Yea. I’m glad you’ll be able to use them. I am hoping that they get put to good use by lots of bloggers out there. :)

3. KUMAGCOW aka JOHN (1 comments.) - August 10, 2008

Thank you so much for posting this…I’m in the same dilemma… great thing there’s people like you that knows how to help noobs like me ^_^

KUMAGCOW aka JOHN of http://www.kumagcow.com’s last blog post..Some Humor from Denster and the old fanzine "MONTHLY PERIOD"

4. Amy @ Thoughts from the Mrs (1 comments.) - January 4, 2009

I’ve tried over and over to make this work on my new wordpress site. What am I doing wrong? Please, help!

Amy @ Thoughts from the Mrs of [site]´s last blog post..How I Spent My Sunday

5. hillbillyduhn (2 comments.) - January 8, 2009

You are a life safer, I just spent the better part of an hour looking for exactly this, that I didn’t know the name of either and stumbled across your site!!!! Thank you oh so very much!!

6. hillbillyduhn (2 comments.) - January 8, 2009

saver not safer, I’m a dork…

7. Davida (1 comments.) - January 9, 2009

THANK YOU! I had no idea how to do this until I came across your page.

Davida

8. Nani (1 comments.) - January 13, 2009

Thanks SO much!!!!!! Do you any good websites/books to improve my html? Thanks again

9. Dee (1 comments.) - January 14, 2009

Wow!! That was helpful & very cool!!
Thank you!
:-)

Dee of [site]´s last blog post..Successful Son Raised By Single Mom

10. jac - January 14, 2009

thank you so much

11. Saph (2 comments.) - January 22, 2009

OMG!!! Thank you so much for this post! I found your site by googling grab my button. It was simple…a text box… thanks so much!!!

Saph of [site]´s last blog post..Can you take it as well as you dish it out?

12. Saph (2 comments.) - January 22, 2009

Oh, and I’m grabbing your button too! Just because!!!

Saph of [site]´s last blog post..Can you take it as well as you dish it out?

13. Barbara (1 comments.) - January 23, 2009

You ROCK, what else can I say? You made it easy! Thank you.

Barbara of [site]´s last blog post..Smart Shopper Giveaway

14. Stefani (12 comments.) - January 24, 2009

Thanks so much for posting these instructions. I had been wanting to add this feature to my blog and did not know what it was called either. I found this post today while searching for instructions.

Now I have the Grab My Button Feature too!

Stefani of [site]´s last blog post..Biker Mommy, Not!

15. tinateee (1 comments.) - January 31, 2009

Hey thank you so much for sharing, this was very informative.

tinateee of [site]´s last blog post..Cute Casual Wear Pick

16. Verna (1 comments.) - February 5, 2009

Thanks so much for sharing this. ~verna

Verna of [site]´s last blog post..Way too Cute!

17. Your Impact Matters (1 comments.) - February 11, 2009

Thank you so very much for this. I’ve been trying to figure this out for a long time, and my button html has been a bit faulty (even though I used html from someone else’s working button and just replaced my url info and image location). This tutorial did the trick! I forwarded the information on to my mom for her blog as well.

Thank you so much! I’m so thankful for you today!!!

Your Impact Matters of [site]´s last blog post..Scandle Candle Giveaway

18. amanda (1 comments.) - February 12, 2009

Unclear?
Am I adding an html code, a picture, what am I adding in the gadgets of the format??
A

amanda of [site]´s last blog post..Hair Flowers Deconstructed

19. What Squeaky Shoes (1 comments.) - February 18, 2009

Thank you for sharing this info!

20. The Extreme Housewife (1 comments.) - February 18, 2009

Thank you so much! I used your instructions to add a button to my blog.

The Extreme Housewife of [site]´s last blog post..Organizing Your Craft Room

21. Angela (1 comments.) - February 22, 2009

Thanks for posting this – I used your instruction and also am a new follower to your blog! Thanks!

Angela of [site]´s last blog post..Sunday Summary

22. Brittany (1 comments.) - March 6, 2009

Woo hoo! Thanks so much! I linked to you too…this was so super easy to follow!

Brittany of [site]´s last blog post..I Have A Button!

23. Janice @ Mom On The Run (1 comments.) - March 14, 2009

Thanks so much for these instructions – I’ve used them to put a “Grab our Button” code on the a new site that I’m working on launching: The Big List of Giveaways.

24. Melissa (1 comments.) - March 15, 2009

Thanx so much for writing this post. I found it via Google search and it is exactly what I needed.

Melissa of [site]´s last blog post..Daily Confirmed Earnings ~ 3/12/09

25. Rita (1 comments.) - March 24, 2009

Thank you, thank you! I am so excited because I never knew how to do this and always wanted to!

26. Crystal (1 comments.) - March 27, 2009

So I did it but I did something wrong but can’t figure it out. I was wondering if you could possibly check it out on my site to see if you can see what I might have done wrong there. If not thats cool, I’ll figure it out some how, LOL.

Crystal of [site]´s last blog post..30 Days Of Spring +Day 3

27. SBA (1 comments.) - March 30, 2009

Hi, I was checking my Google searches and found your problem. I love my grab button! It’s frustrating when you’re soooo close… hope you don’t mind me ‘butting in’– I took a quick look and you need to delete the ‘www.’ in your image location! The Flickr image database uses only the ‘http://” Check it out by right clicking the image shown above the scroll box, select properties, where you’ll see the actual location. Good luck,

SBA of [site]´s last blog post..How to Gussy Up Your Best Blog Posts

28. I Have A Button! | Clarke Family Website - April 24, 2009

[...] (And I totally did this all.by.myself…okay well I researched it all by myself. Thanks to Kimberly for supplying the super easy [...]

29. Derinda (1 comments.) - May 9, 2009

Thank you so much for these instructions. I’ve been searching for these for weeks now and I appreciate you making it so simple.

~Derinda

Derinda of [site]´s last blog post..FEEDBACK!

30. Jen Eskridge (1 comments.) - May 23, 2009

Thanks so much for this crystal clear tutorial! I’ve been looking for the “how-to” on the Grab My Button deal for sometime now. Thank you thank you thank you. ~jen~

31. Katie (2 comments.) - May 23, 2009

Thank you! Thank you! Thank you!! I’ve been looking forever for instructions to do so but, like you, didn’t know what to call it and my searches were coming up useless.

Katie of [site]´s last blog post..Sunday Stealing: The A to Z Meme

32. Keri Lyn@SheSaved (1 comments.) - May 28, 2009

You totally ROCK for posting this!! thank you thank you thank you!!

Keri Lyn@SheSaved of [site]´s last blog post..Thurs. May 28 by Noon is LAST Chance TO SIGN UP for this GIVEAWAY!! $20 at Usborne Books!!

33. Yanic A. (1 comments.) - June 7, 2009

Very informative! Thank you. I had been wanting to find an easy way to do this for a while now.

Yanic A. of [site]´s last blog post..Dryer sheets and fabric softeners : Big hazards come in sweet smelling packages

34. Linda Thieman (1 comments.) - June 29, 2009

Oh, heck! Thank you, Kimberly! This worked like a charm. You explained it so well and made it so easy. Really appreciate it. I’ve now got a Grab Our Button section up on the Katie & Kimble blog!

35. claire (1 comments.) - July 1, 2009

Hi Kimberley –

I worked hard on this but something is wrong with mine – do you have any idea what I’m doing wrong?

It goes INTO my site fine, but then when I use the code that it’s come up with an image won’t post!

any thoughts?

This is the code I used to put it on my site (choystercash.com – in the right hand bar)…

<a href=”http://www.choystercash.com”mce_href=”http://www.choystercash.com” target=”_blank”><img src=”http://www.choystercash.com/wp-content/uploads/2009/04/choyster_button-web2.jpg” mce_src=”www.choystercash.com/wp-content/uploads/2009/04/choyster_button-web2.jpg”></a>

claire of [site]´s last blog post..Free Trial of Sitter City

36. Kim (1 comments.) - July 15, 2009

Thanks for this! I have been trying to figure it out.

Kim of [site]´s last blog post..Wordless Wednesday- Strong Man!

37. Websites tagged "textarea" on Postsaver - July 15, 2009

[...] – How To Put A “Grab My Button” Link on Your Blog saved by nandoya2009-07-06 – TextArea.htmlText FIXED! saved by MrsAtomicUs50002009-06-20 – [...]

38. yonca (1 comments.) - July 15, 2009

Thank you so much for this post. It was very helpful.

yonca of [site]´s last blog post..Perky Blogger Award

39. Iresha (1 comments.) - July 22, 2009

This has been a real help to me as the Blogger templates are terrible. Thanks a lot!

40. Kirsten (3 comments.) - July 25, 2009

I was looking all over for instructions and low and behold – Viola, there yours were! Thank you, thank you, thank you!!

41. Kirsten (3 comments.) - July 25, 2009

Well I thought I had it, but when I tested the button, it took me to my picture on photobucket – UGH!

42. Kirsten (3 comments.) - July 25, 2009

I’m good, I’m good – this rocks!

43. maryleigh (2 comments.) - July 28, 2009

Word press doesn’t allow some html. For example, the textura. Do you have any suggestions for wordprss users?

44. maryleigh (2 comments.) - July 28, 2009

Hi, when I put it in my widget area and hit save, this is what I end up with:

Any suggestions?

45. WackyMummy (2 comments.) - August 8, 2009

I’ve googled about the grab-button, and your advice came up. I tried your advice on how to do this, but I can’t make it work. I cut and pasted as your directions said, and inserted my info, but I’m obviously not oing it right. Could you email me?

thanks.

46. WackyMummy (2 comments.) - August 8, 2009

my email: koreenwnaugler at yahoo dot com

47. thoughtsnstuff.com - August 14, 2009

[...] A big thanks to allaboutkimberly.com for her post on how to add a button “thingy.” [...]

48. The SoCal Mom (1 comments.) - August 25, 2009

Such simple instructions! Made my button in 2 minutes! THANKS!

49. Serendipity is Sweet (1 comments.) - September 2, 2009

Sweet! I’ve been looking for this. I followed your directions and it worked for me. Thanks!

50. Kristi (1 comments.) - September 15, 2009

Hi,
I have tried it & it looks great on my site, but when I tested it to place on another blog, it has some crazy symbols and a pic box on top. Can you tell me what I am doing wrong & how I can fix it?
Thanks!

51. Tracy (2 comments.) - September 21, 2009

Thank you, thank you , thank you!

I didn’t know how to do this either! And like magic… the text box w/ the scrolly thing is on my website! Woo-hoo!

Thanks Kimberly!

52. "Grab My Button" thingy. | Hall of Fame Moms - September 24, 2009

[...] kudos to All About Kimberly for making it so simple to have something so cool on our blog too! There a couple different ways [...]

53. Tracy (2 comments.) - September 24, 2009

Hey Kimberly,

I did a post about the ‘grab my button’ thingy with a link back to your post so my readers can learn to do this from you.

Thank you again!

http://www.halloffamemoms.com/2009/09/grab-my-button-thingy/

54. Need a Button? Here’s the code | BuckeyeVA Blog - September 24, 2009

[...] Tracy shared this information with me and now I’m sharing it with you. Thank you to Tracy and Kimberly! Post Published: 23 September 2009 Author: admin Found in section: Ohio [...]

55. kate (1 comments.) - September 29, 2009

I appreciate your post. It’s the only one I’ve seen like it with details on how to do this. However, I can’t seem to make it work either, lol. I’m not sure what I’m doing wrong. When I insert the text all that comes up on the blog when I preview it, is the text, no picture…. Is it the picture that’s the problem or any other ideas?

56. Stacey (1 comments.) - October 14, 2009

Thank you! I’ve been searching forever for this!!

57. Kristin Gentry (1 comments.) - October 23, 2009

THANK YOU!!! I’ve been trying to figure this out; my web guy (through work) did a Google search and found this blog entry. I had no idea what to look for and I appreciate you posting the info!

58. Denise@TogetherWeSave (2 comments.) - December 3, 2009

Help… I have a button and I use regular blogger. I have no Idea the location of my button. I am lost. Please help me.

59. Lisa (1 comments.) - December 4, 2009

Thank you so much for this wonderful tip! Very helpful :-)

60. Samina (1 comments.) - December 16, 2009

Hi, I tried this, and the button is there and looks great, but when I clicked on my logo pic, it took me to photobucket where I saved and stored the pic. Please help, I want it to go to my website when clicked on. I hope you can help me figure this all out. Thanks in advance. In the meantime I will remove the botton.

61. Laura Taff (1 comments.) - December 30, 2009

Thank you so much! I sincerely appreciate this info. It worked very easily.

62. Elizabeth (1 comments.) - January 10, 2010

YAY! I have a blog button of my very own now!! Thank you so much for posting these instructions :)

63. Yona Williams (1 comments.) - January 11, 2010

Thanks a lot for these directions! They were clear and easy to follow. Love when you can get right down to business without wasting time with complicated jargon. The examples really help illustrate the point as well. Thanks again!!!!

64. Peggy Gorman (1 comments.) - January 13, 2010

Thanks so much!! You explained it so easy!!

65. Julie (1 comments.) - February 5, 2010

Help.. I can’t seem to make this work, any help is so much appreciated.

I am a new blog site and just in learning stages…

66. GGhadden (1 comments.) - February 9, 2010

Thank you soooooooooo very much, I have been trying to make this work for a long time and you cleared it up beautifully.

67. Evelyn (1 comments.) - February 16, 2010

Thank you very much! Very helpful.

Leave Your Thoughts Here »






Favorite Sites

An Island Life
  • Photobucket
    Photobucket
  • Recent Posts

  • Archives

  • Categories

  • Blog Events

    Get your own free Blogoversary button!
    Coffee Chat at writefromkaren.com

    Support Our Troops

    My CLICKTHRU HOT SPOT is located on my Blog Links page.
  • SPONSORS

    Interested in placing an ad on this site? Click HERE to place an ad below.
  • Spam Blocked