Friday 13 July 2012

How To Create A Grab Me Button


Hey Everyone!

When I was going about creating a 'Grab Me' button so that I could get involved in free button swaps, I thought it was going to be really hard, but it honestly isn't! So I decided to do a blogpost on how to make your blog button available to be grabbed of your blog, like this:



  1. You need to create a logo, you can do this on Picasa (a free download from google, you can download it here) or on Photoshop (You have to pay for this, you can buy it here)
You can create this button by adding lots of photo's together or clip art, however you want to do it. I made mine on Picasa by creating a collage of pictures I had taken & then adding text. I resized it to 150pixels here .

2. You need to upload your photo to 'PhotoBucket' which you can find here , you do need an account to upload photos but this is completely free!
You must upload your picture to Photo Bucket
by clicking on the upload button.

3. Then you need to log onto your blogger dashboard, go to layout, and click on add gadget:

4. Then click on 'HTML/Javascript'
And click the + button in the corner.

5. Then you should see this screen
Change the title to 'Grab My Button' or something along those lines, and then in the content box copy & paste the following codes, don't worry that it has my information in for the moment, we will be editing that in a minute.

<div align="center"> <a href="http://beaumaquillagex.blogspot.co.uk" target="_blank"><img alt="Beaumaquillagex" src="http://i1245.photobucket.com/albums/gg594/Beaumaquillagex/JuneFaves2012.jpg"/></a> </div> <div align="center"> <form><textarea rows="6" cols="20"><center><a href="http://beaumaquillagex.blogspot.co.uk" target="_blank"><img alt="Beaumaquillagex" src="http://i1245.photobucket.com/albums/gg594/Beaumaquillagex/JuneFaves2012.jpg"/></a></center></textarea></form> </div>

Once you have copied and pasted that we will change some of the information.

Change the bits in pink to your blog address, make sure you leave the " marks, these are extremely important, if you accidentally delete this the whole thing won't work! Then change the bits in blue  to the name of your blog, again minding the " marks.

6. Do not save this yet! We still need to edit it more, open up another window/tab with your picture in photobucket, click on your picture and copy the 'Direct Link'


then go back to the code your are editing:

<div align="center"> <a href="http://beaumaquillagex.blogspot.co.uk" target="_blank"><img alt="Beaumaquillagex" src="http://i1245.photobucket.com/albums/gg594/Beaumaquillagex/JuneFaves2012.jpg"/></a> </div> <div align="center"> <form><textarea rows="6" cols="20"><center><a href="http://beaumaquillagex.blogspot.co.uk" target="_blank"><img alt="Beaumaquillagex" src="http://i1245.photobucket.com/albums/gg594/Beaumaquillagex/JuneFaves2012.jpg"/></a></center></textarea></form> </div>

and change the bits highlighted in orange to your direct link code, again minding the " marks, then press save.

When you go onto your blog you should have a blog button with a grab me box!
If not re read the steps to make sure you have done everything right, and make sure you mind the " marks!

Thanks for reading 
p.s check out my post on free button swaps! 





14 comments:

  1. Your button is live on my page!! Thanks for swapping <3

    ReplyDelete
    Replies
    1. Fab thanks very much :) Thankyou to you too! <3

      Delete
  2. Thanks for this, been wondering for ages about how to create a button x x x

    ReplyDelete
    Replies
    1. You're very welcome :) I am glad it helped you! That makes me happy :) xxx

      Delete
  3. Thank You so much for this, I've been wanting one for a while now. Added your button to my blog too

    ReplyDelete
    Replies
    1. You're very welcome! I am glad it helped you, oh thanks very much :) If you have a blog button I will put it on my site :) xo

      Delete
  4. Great post! Will come back to this when I do mine! x

    ReplyDelete
    Replies
    1. Thankyou! I am glad it helped, tell me when you have a blog button, and maybe we could do a button swap?xx

      Delete
  5. Ahhh thank you so much! :) I now have a button on my page :D xxx

    ReplyDelete
    Replies
    1. You're very welcome! I am glad it helped :D Yay I am going to check it out now & we need to do a button swap :D xxx

      Delete
  6. your button is on my page! love your blog xx

    ReplyDelete
    Replies
    1. Fab thankyou! I will put yours on mine now :D aww thanks :)xx

      Delete
  7. Fab! Thank you for this! I was ready to throw my laptop out the window xxx
    http://learninglessonsinmummyography.blogspot.co.uk/

    ReplyDelete
    Replies
    1. You're very welcome :) I am so glad this helped you! xx

      Delete

Thankyou for commenting, it makes me smile! I will be sure to reply to all comments within 24 hours. Please feel free to leave your blog link, but not 'Follow for follow' because then I definitely won't follow you! Thanks :) x