Happy Kids, Inc: Must Have Blog Resource: Grab A Button!
Wednesday, March 20, 2013

Must Have Blog Resource: Grab A Button!

In my continuing look at Promotion of Your Blog, I'll focus today on creating a button for your blog.  If you are new to blogging, you have undoubtedly seen buttons on various sites with code that you copy and paste to add to your blog.  If you've been part of a blog hop or other promotion, there is often a blog button with code to go along with it.  

When bloggers speak of a "blog button", they refer to a graphic image that links to their blog, a blog hop, a giveaway, or other promotion.  If the button is on the host site, you will see the html code directly below the image for your use to add to your blog if you so choose.  

Blog buttons are necessary in the blogging world.  You definitely need a basic one that you can use to link to your blog.  If you decide to host other events on your blog, a button is handy and helps in your promotion.  But many bloggers don't know a lot about html and code.  If you pay a web designer every time you need a button re-formatted or created, you will go broke!  Below I've shown a few examples of buttons I have created.

I use a great site that makes the generation of a button with code very easy.  The website My Cool Realm has a great button generator.  You will need to have a few things prepped and ready to go, including the graphic you would like to use for the button, the image url, and the link to your site.

Hopefully you have a smart phone or are familiar with online photo editing resources, like Pic Monkey.  Phone apps like Phonto, Bubble Frame, and Instaframe make it easy to use photos, fonts, and backgrounds to make cute buttons.  

Once you have created your desired blog button with one of these methods, be sure you have sized it to your desired button size (I like 125x125 or 200x200).  If you use an online photo host site like Photobucket, you can easily edit your blog button you've created, including the size. In Photobucket, you can also easily access the image url and copy and paste it in the button generator. If it's a graphic that you have already used in a previous blog post, simply right click the image and select "copy image url" to obtain the image url.

So, in the button generator, you will enter a given title for your blog, the image url, and the link to the post.  Below this, select "textarea" if you use Blogger, otherwise select "Pre".  Leave the presets on the background colors (they won't affect your image).  Leave the measurements on "auto".  Click "yes" to open the link in a new window.  Finally, hit "preview".  Your button should pop up.  If you are happy with it, click the "get code" button below the preview.  It will return you to the main screen and the button code will be available to copy at the bottom of the page.  

If you like what you're reading, I invite you to follow my blog.  Cheers!

4 comments:

  1. Great tutorial and that is the sites I use, too!! :)

    ReplyDelete
  2. Hi Meg
    Thank you so much - this tutorial was just amazing and exactly what I needed. I have finally made myself a button following your instructions.

    Thanks again.

    Kate x
    http://www.kateathome.com/

    ReplyDelete
  3. Stopping by from the #ThumpingThursdays #BlogHop! http://queenofsavings.com

    ReplyDelete

09 10 11 12
Blogging tips