How to Make a Blog Button and a "Grab my Button" Box

Posted by Unknown on 5:24 PM in Blog Tips,

 I'm a newbie blog mom and seeing all these blog buttons everywhere with the names of the moms' blogs and boxes that say, "Grab My Button" or "Add our Button to Your Blog", etc. It never crossed my mind I needed one...I just thought, "Ok, expert bloggers really know how to do this stuff", and I moved on...
Until recently, I was chatting with a wonderful friend of mine, a tennis teammate from college. She is a blogger, a great one with lots of expertise when it comes to designing blogs, adding widgets, etc. (visit her blog at http://sneakymommablogdesign.blogspot.com). She suggested that I add a button to my blog to help advertise it. "Well," I thought, "How do I do that?" I didn't even know I could create my own design and illustrations! So, I did what everybody else does nowadays, I googled it! I found interesting and helpful tutorials and tips, but when it came to actually adding a "Grab my Button" HTML code, I was struggling...
I contacted my friend again, and she gave me a wonderful site that made everything so easy! I'm going to give you a short tutorial on how to make a blog button and how to add the grab box to your blog. However, if you are a newbie like me and need more help designing your blog, go to Sneaky Momma! She has tons of tutorials and tips to help you out!
 
STEPS TO MAKE YOUR BLOG BUTTON:

• First you need to create your design. I'm a children's book author/illustrator, so I have a digital program to create my own design and drawings. However, if you have a PC, you can create your own design using a program called Microsoft Paint. Here's the link of the tutorial for you to learn how to use it: http://windows.microsoft.com/en-us/windows7/products/features/paint   

• If you prefer, you can also just use a photo. Be creative! 

• Next, save your work or photo to your computer.  

• Go to an online photo site like Photobucket http://photobucket.com/and upload your design/photo. Photobucket is easy to use. You can even sign in with your Facebook account. 

• Once your photo is on Photobucket, go to "Edit Photos" and click on "Resize". Choose 125 Width and 125 Height and click "Apply".

• Go to your Blogger, sign in, and go to your Add Gadgets layout (where you want your button to appear). This page is going to ask you to add the HTML code.

• Now, this is the greatest tip my friend Sneaky Momma gave me! Go to "Grab my Button Code Generator" http://www.mycoolrealm.com/sandbox/gbgen/index.php and with 3 easy steps you can create your HTML code.

• On that site, you first input the title of your blog, your blog URL, and then your image URL. For the image URL, go to Photobucket, click on your photo, and you will see a box on the right side that says, "Links to Share this Photo". Choose the "Direct" link from that box. If you just click on it, it will automatically copy for you. 

• Back to the Code Generator site, if you like the way it is, just leave the rest set to "auto". Or, if you wish, you can change your border color, type, size, etc. 

• Click "Preview". You will see an HTML code designed for you. If you like the way it looks, copy that code. If not, go back, make changes, and click preview again. 

•  In your Blogger, paste the HTML code into the HTML gadget box, add a title such as "Grab my Button" or "My Button", etc. Save it. 

That's it! You just created your own button! Hope this is very helpful for you. Happy Blogging!