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!
thanks for adding this for those who do not know, that is helpful. I hope your week is great.
ReplyDeleteI am from the Etsy blogging team, I try to comment on at least three blogs ahead of mine when I post.
enjoy 8~*
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!
ReplyDeleteYou have a pretty darn cute button, too
ReplyDeletecouldn't be clearer!:D and yep, your button looks enticing!;)
ReplyDeleteThank you for the feedback!
ReplyDeleteYour tutorials are great! Thanks for helping us out!
ReplyDeleteThis was AWESOME -- so clear and easy-peasy. I can't thank you enough. :)
ReplyDeleteYou are welcome! I am glad I could help.
DeleteOMG!! Thank you, this was great-so easy & thanks for the visual aide lol-and it worked!!
ReplyDeletexoxo
twentyfour7
You are welcome, Susan, I am glad I could help!
DeleteThanks so much!
ReplyDeleteThank 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.
ReplyDeleteHi Joy, I am so glad my tutorial was helpful to you! I am off to check out your blog!
DeleteThanks so much! This helped me understand exactly what I needed to do - and why! Much appreciated!
ReplyDeleteWow, I was having no luck at all figuring this out, thank you SO much for the easy to follow insturctions
ReplyDeleteThank you soooooo much!!!!!!!!!!!!!!!
ReplyDeleteI 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.
ReplyDeleteAnne
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!
DeleteThank you so much for this!! I'm new to blogging & this helped a lot!
ReplyDeleteThank you so much for this post! It was perfect to follow! You have done an awesome job!!
ReplyDeleteGreat Help! Thanks so much! I have a lot to learn! will be visiting you very often!
ReplyDeleteThank 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
ReplyDeleteThank you very much. This was easy and helpful.
ReplyDeletethank you- simple one you know how!
ReplyDeleteThank 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!
ReplyDeleteYou are welcome, Kirsten!
DeleteYou made it look so easy to even a non technical person like me who just recently started a blog..thankyou for the visual aid.
ReplyDeleteThank you. Awesome explanation. :) Moo
ReplyDeleteThank you!
ReplyDelete