Step 1: Find your buttons. You can make them, or do a search and save the ones you like. I made mine and will be posting various versions of them for you on tomorrow's Made It Monday post.
Step 2: Upload your buttons to photobucket. Make sure that you've marked your album "Public".
Step 3: In your Blogger Dashboard, go to Layout and add a gadget. Choose HTML/Java Script as the gadget type.
Step 4: In your PhotoBucket account, hover over the first icon you want to use and click on the HTML code link to copy it. Paste this into the Blogger gadget box. Repeat this procedure for the other buttons. They all go in the same box.
Step 5: Click "Rich Text" and you should see your buttons. Highlight the first button and use the third icon to create a link. Repeat until you've added all of your links.
*Note: your email link is mailto:youremailaddress
Step 6: Save your widget and place it where you want it on your page. Preview your blog, then save the changes. You're done!
nice widget, i ll place it in several my blogs :)
ReplyDeleteThanks for the tutorial. When I past in the direct URL for the picture and then click Rich text in the widget box, I just see a code, not the picture. Any ideas? TIA,
ReplyDeleteHeather
Kickin' it in Kinder
Heather, thanks for bringing that to my attention. It's the HTML code that you use instead of the direct link. I fixed it in my post. Sorry about the confusion!
ReplyDeleteFarrah
im having trouble getting the button to appear. i still see it as a link when i paste it. when i right click my photo in photobucket my only copy option is copy link. and that doesnt work..any tips?
ReplyDeleteWow! I need to tell you that you are a life saver as far as helping me out with adding my own social buttons on my blogger account. I have been googling for days trying to figure this out and you made it pretty simple to figure out. I added my own social buttons, tweaked a bit and now it looks great. Thanks SO much!
ReplyDeleteIt's me again. I just wanted to let you know that I added a link to this post on my own blog for others who are trying to figure out how to add custom social icons to their own Blogger site. http://lindahadalittlelamb.blogspot.ca/2013/01/adding-custom-social-buttons.html
ReplyDeleteI have been meaning to say THANK YOU for months after finding your very useful post! The joy of learning... it never ends!
ReplyDeleteKind regards,
Callie
http://callieandchef.blogspot.co.uk/