26 April 2011

How To Grab Someone's Button

So, you have seen the beautiful squares on blog sidebars with the unreadable HTML code underneath and have read the blog authors' words encouraging you to GRAB THEIR BUTTON! But how can you do that? Here is an easy and fast step-by-step tutorial which will help you show the things that are important to you and strengthen your social contacts in Blog World.
 

HTML is the backbone of every blog and website, it lies behind each color, photo or any element you can think of on your blog. But thanks to blogging platforms such as Blogger, you don't need to know what that is in order to use it!

Now, imagine you are taking part in a Blog Hop which requires you to publish the badge for the period of the blog hop, or you want to host some blogger's button on your page. you can do this in 10 easy steps:

1. Go to the Design Tab of your Blogger page and click on Page Elements. As you have noticed, it is a representation of your actual blog page. You can add, remove and rearrange the page elements in order to customize your blog according to your taste. 


2. You want to place the button on your sidebar and not as a regular post, because you need it to stay on the front page for everyone to see. Then click on the Add Gadget option on the right sidebar.


3. When you find the HTML/Java Script gadget, which you actually need, just click on it and a small window will open, very similar to the one you get when you write your blog posts.




4. It is very important to see Rich Text on that window. It means that you are in the right mode for adding an HTML code.


5. Now go to the blog which holds the button you are interested in. Select and copy the html code under the button you want to use.

6. Then go back to the small window and paste the code. If you want to have a title, go ahead and write it. I chose not to have one and left the field empty.

On the left you can see the HTML code and on the right is how it actually looks. Press on Rich Text and Edit Html to switch between views.


7. Save the changes.


8. Take a look at the Page Elements tab. The latest gadget is at the top of the sidebar. Here again click on Save.


9. If you want to move the gadget, just click on it and hold to drag it to the position of your choice. 



10. Save again and off to enjoy your blog page!

30 comments:

  1. thanks for adding this for those who do not know, that is helpful. I hope your week is great.

    I am from the Etsy blogging team, I try to comment on at least three blogs ahead of mine when I post.

    enjoy 8~*

    ReplyDelete
  2. Great tutorial! If it weren't for all the help on the internet, I'd never have all of the features on my blog the way I want them. Thanks!

    ReplyDelete
  3. You have a pretty darn cute button, too

    ReplyDelete
  4. couldn't be clearer!:D and yep, your button looks enticing!;)

    ReplyDelete
  5. Your tutorials are great! Thanks for helping us out!

    ReplyDelete
  6. This was AWESOME -- so clear and easy-peasy. I can't thank you enough. :)

    ReplyDelete
  7. OMG!! Thank you, this was great-so easy & thanks for the visual aide lol-and it worked!!

    xoxo
    twentyfour7

    ReplyDelete
    Replies
    1. You are welcome, Susan, I am glad I could help!

      Delete
  8. Thank you - after spending ages trying myself (obviouly unsucessfully) I found your blog and within minutes I had added someone elses button to my blog. So a big thank you - now I'm going to practise my new skill by adding your bog button to my blog.

    ReplyDelete
    Replies
    1. Hi Joy, I am so glad my tutorial was helpful to you! I am off to check out your blog!

      Delete
  9. Thanks so much! This helped me understand exactly what I needed to do - and why! Much appreciated!

    ReplyDelete
  10. Wow, I was having no luck at all figuring this out, thank you SO much for the easy to follow insturctions

    ReplyDelete
  11. Thank you soooooo much!!!!!!!!!!!!!!!

    ReplyDelete
  12. I am grateful for this tutorial, but I must be missing something. I followed all the steps (I do use Blogger so it was exactly what I needed) and then I could get the button onto my blog in general, but I can't get it into a specific post. Does that even make any sense? Help! Thank you so much.
    Anne

    ReplyDelete
    Replies
    1. If you want to paste the button in a specific post don't go to gadgets, etc. Instead, on the first step go to POSTING. Then paste the code into the HTML version of the post. If you have any more questions, fire away!

      Delete
  13. Thank you so much for this!! I'm new to blogging & this helped a lot!

    ReplyDelete
    Replies
    1. You are welcome! If you have any other questions, don't hesitate to contact me :)

      Delete
  14. Thank you so much for this post! It was perfect to follow! You have done an awesome job!!

    ReplyDelete
  15. Great Help! Thanks so much! I have a lot to learn! will be visiting you very often!

    ReplyDelete
  16. Thank you but this works for me when there is a text box below the grab button but when there is just a picture and it says grab my button I end up with the text only on my side bar and not the picture any ideas for me

    ReplyDelete
  17. Thank you very much. This was easy and helpful.

    ReplyDelete
  18. thank you- simple one you know how!

    ReplyDelete
  19. Thank you so much! I've been wracking my brains trying to insert these simple buttons. I've searched google, but all I could find was how to make your own buttons. Thanks for making it easy to understand!

    ReplyDelete
  20. You made it look so easy to even a non technical person like me who just recently started a blog..thankyou for the visual aid.

    ReplyDelete
  21. Thank you. Awesome explanation. :) Moo

    ReplyDelete