Tuesday, August 7, 2012

10 Easy Steps to Create a Grab Button for Your Blog...

I have finally figured out how to make a simple "grab button" for my blog!
& I'd love to help you make one too...


So, let's get started!
  1. Grab an image that you want to use for your blog button (Or grab a blank image that you have saved). 
  2. Head on over to Photobucket.com - & Create an account if you don't already have one--It's quick and easy! (that's what she said)
  3. Upload your image and then go to "Edit" (which should appear if you hover over the image), then click on "Adjustment"- here you will "Resize" your image to 130x130 or 150x150. --Easy right?!
  4.  Once you have resized your image, feel free to play around with text, borders, stickers, etc. (All of which is still under the "Edit" option)
  5. SAVE YOUR IMAGE AS A COPY! (Just in case you want to start over using the original)
  6. Click on your beautiful piece of art-- & scroll down to where you see the "Links" listed on the side. COPY the "Direct Link" and paste this in a BLANK word document. (you'll need it in a moment!)
  7. In your word document, give yourself some space & copy/paste the following codes:

[div align="center"][a href="YOUR BLOG URL GOES HERE" target="_blank"][img src="YOUR IMAGE URL GOES HERE"][/a][/div]

[div align="center"][form][textarea rows="3" cols="19" readonly="readonly"][a href="http://YOUR BLOG URL GOES HERE" target="_blank"][img src="YOUR IMAGE URL GOES HERE"][/textarea][/form][/div]

   8.  Replace YOUR BLOG URL GOES HERE and YOUR IMAGE URL GOES HERE - with your blog url, and the "Direct Link" that you copied.

   9.  Change ALL of the brackets "[" to carrots ">" (not sure of their technical names)...or in other words all of the [ to < and all of the ] to >.

 10. In Blogger, add the "Html/Javascript" gadget...& paste your code in the area given to do so.

To ensure that the code that appears under your button works, test it out >> Click Here

Et voila! 

You have just created a fabulous button! 
That wasn't so bad was it?


18 comments:

  1. ... still sounds confusing to me, lol. It's like when I hear someone speaking another language all I'm thinking is "Huh???" - LoL.

    ReplyDelete
  2. Looks great! Want to swap buttons now? :)

    ReplyDelete
  3. very clear instructions! blogger should hire you!

    ReplyDelete
  4. Great instructions. Once I finally get a decent header and what not, I will for sure use this to make a button.

    ReplyDelete
  5. Sounds good! Let me know when you've made one, & I'll post it on my page! :)

    ReplyDelete
  6. Replies
    1. Just tried to grab your button but the code underneath it is incorrect :(

      Delete
  7. Hi! Thanks for the info!! I took your button after I made mine!! My blog is http://apreemiesmommy.blogspot.com/ if you wish to visit :)

    ReplyDelete
    Replies
    1. Hi, Amy! :) Thanks for stopping by & for grabbing my button! I just checked out your blog, & I am now following. I look forward to reading your posts!

      Delete
  8. I'm a new follower from MBC...I am going to try this tomorrow...Tonight my brain is way to tired to think...

    Check out my blog and follow me back
    http://melissalovescoupons.blogspot.com

    ReplyDelete
    Replies
    1. Hello, Melissa! :) Thanks for stopping by! Following back.

      Delete
  9. Thanks for sharing this. I've been wondering how to make a grab button ;)

    ReplyDelete
  10. Thank you SO MUCH for the directions. You are AMAZING! :)

    ReplyDelete
  11. THANK YOU! I was finally able to create my button. Not the exact style that I wanted (because I'm not that artistic) but it's a button!! Thanks!

    Erin

    www.erintheirishmama.com

    ReplyDelete
  12. So excited to try this out! BTW, LOVE your blog name!! Might be my favorite of all time :).
    Thanks for the tips!

    www.FranticMama.blogspot.com

    ReplyDelete