Friday, 8 March 2013

DIY: How To Quickly Make A Blog Button

I know a lot of you have blog buttons already, but then again I know many of you don't. I took me so long to work out how to make one and I found it hard to find a simple tutorial. Therefore, so you don't have to suffer like I did, I present a step-by-step guide on how to successfully make your own button!
P.s When I say blog button, I mean a linked image that takes you to your site, not just an image on your side bar  ^_^
Step 1 - Using a photo editing site - I used Pic Monkey - upload and create you desired image. Don't forget to chose the size (from experiance, a lot of bloggers want it 250x so thats always a safe bet)


Step 2 - Upload this image onto a photo hosting site. I used Tiny Pic as I was very reliable to me (I may look a bit dodgey but its not!) and It gives you the perfect link. You will need the ' Direct Link For Layouts' - the bottom link.



Step 3 - You then want to go to http://www.mycoolrealm.com/sandbox/gbgen/. You then want to type into the correct spaces, your blog name, URL and, in the box where it says 'Your Image URL', the link from Tiny Pic. You then want to chose the colour schemes, If you want to open a new window etc. That part is up to you. Then click preview.

 Step 4 - Once you hit preview, you should be taken to a screen like the one below. Make sure it shows the correct image. Then click Get Code.  You should then end up with another box with the full code it. Highlight and copy this.


Step 5 - Then go to your blogger dashboard and click layout. You then want to click add gadget and then HTML/Javascript. Then paste your code.


Step 6 - Click save and then just to be sure, click save arrangement. Then view blog. It should look like this -


If it does, Congratulations! You have successfully made a blog button!

Just a things to add:
 - When you give others your code, you want to give them the one in the little box below your image, not the one you used.
- When you click on the button on your blog, it will not be linked. But when you give others it, it will be (hopefully). To check, just add the code in the little box to a new HTML gadget!

So there you have it! I hope this has helped some of you to make your own buttons and for those of you who have one already, maybe you will find this helpful to. Anyways, I hope this has helped someone. If you have any problems/questions, just let me know and I will do my best to help.  Hope you had a good week.

Helena xx

SHARE:

30 comments

  1. Thank you so much for this! This helped me so much, and wasn't too difficult either!
    xo

    ReplyDelete
    Replies
    1. Thanks! I' m glad you found it useful and I've just gone and looked at your button and its great! Xox

      Delete
  2. Thanks so much for doing this post! I had NO IDEA before! Just one quick question - I was doing it yesterday but when I clicked view blog at the end it was massive and filled up most of my page! What did I do wrong? And when do you do the sizes!
    Thanks!

    ~Ellie;) xxx

    ReplyDelete
    Replies
    1. You do the sizes when you are designing your button - on pic monkey go to the option 'resize' and then edit the sizing. Mine is about 250x wide by 120x height . Thanks for your lovely comment xox

      Delete
  3. I think I have just worked it out! If you have time, would you mind checking if it works? Thanks
    ~Ellie:) xxx

    ReplyDelete
    Replies
    1. Of course! I will do it ASAP! Xox

      Delete
  4. I will definitely try this! Thank you :-)
    Aoife xx
    http://passtheteacup.blogspot.ie/?m=1

    ReplyDelete
  5. I will definitely use these tips, as I always dreamt of creating a blog button.
    Thank you so much Helena and I'll let you know when it is finally up xxx :-)

    *Sending you lots of virtual hugs and kisses*

    ReplyDelete
    Replies
    1. Aww thanks! I can't wait to see yours! Sending you virtual hugs too xoxox

      Delete
    2. I apologise for being such a twat, but when I enter get the code all there is the links and my image doesn't pop up, could you help me out if that's okay? I'm so sorry!!!

      Delete
    3. Don't be sorry! I had problems when I first tried too! When you were on the preview on the button genertor, Did your image come up there? If it didn't, then you may have a problem with your image url. If you continue to have problems, just email me! (don't feel sorry - It took me weeks to do mine!) xoxx

      Delete
  6. Thank you soooooooooooooooooooooooooooooooooooooooooooooooo much I can't tell you how much this helped!!!!!!!!!!!!!!!!!!!!!!!!!

    Sanna xxx

    (v v v v v v v v v v v v v v v v v v v v v v Thankful)

    ReplyDelete
    Replies
    1. I'm am so glad I could help and thankyou very much for your amazing comment! ^_^ xox

      Delete
  7. I adore your blog so much and I've nominated you for the 'Liebster Award'. Details can be found here - http://welcometomypalace1998.blogspot.ie/2013/03/liebster-award.html

    Congrats and you are working extremely hard!! xxx

    ReplyDelete
    Replies
    1. Thank so much, Abbie! Your so kind xox

      Delete
  8. Wow sweetie this is incredible easy and fast. many thanks for this tutorial is really cool.
    Now I´m following you swettie I hope your follow me back.

    xoxo

    www.sakuranko.com

    ReplyDelete
    Replies
    1. Thank you for your lovely comment! I will just go and check out your blog now xxo

      Delete
  9. Nice blog! Wanna follow each other on GFC?

    www.donnaiveh.blogspot.com

    have blessed day!

    ReplyDelete
  10. Wanna follow each other on GFC?

    www.donnaiveh.blogspot.com

    have blessed day!

    ReplyDelete
    Replies
    1. Thank you! I'm just going to check out your blog now! Xox

      Delete
  11. This is so useful! I got so confused the first time I attempted a blog button. I just don't understand HTML codes lol, I look at them and give it a go but it's like another language!:) Thans so much for nominating me, it means a lot! xx

    ReplyDelete
    Replies
    1. I'm glad you found it useful! I nominated you because your blog is so amazing and you deserve it xoxox

      Delete
  12. Cool post Helena! And thanks for the link you left on my blog! x
    beautifulyetassertive.blogspot.com

    ReplyDelete

Thank you for taking the time to comment - these make my day thus I make every effort to read and reply to them all. Don't forget to leave a link to your blog so I can spread some love back <3

© She Is Wondering. All rights reserved.
BLOGGER TEMPLATE DESIGNED BY pipdig