Diana Rambles

HOME & AWAY

You are here: Home / Uncategorized / Adding Social Media Icons

Adding Social Media Icons

My Amazon links are referral links. My Disclosure

install social media icons


How to Install on Your Blogger (Blogspot) Blog 

1. Upload icons to image storage site (such as photobucket).
2. Create an HTML/Java Gadget (widget) on your sidebar and use the following code for each icon~

3. Replace the red bolded part with the URL (web address) to your social media site, such as

https://twitter.com/freestylemama 

4. Replace the green bolded part with the direct URL link of the icon, such as

http://i254.photobucket.com/albums/hh91/customblogdesigns/blue-snowflake-twitter.png 

5. Add in front of the code if you want it centered.
    Add if you want a line break.
6. Save
7. You can add all the icons you want to the same gadget/widget!

Updated: I was asked how to link directly to your email address. Here is how:

email html link code

Looking for some fun free social media icons? Check out my freebies here. Including this new set~

free social media icons

Reader Interactions

Comments

  4. Diana--Not sure what I'm doing wrong here. I think I'm following the instructions exactly, but I'm getting a broken link icon when I see it on my blog. Any thoughts?
    Reply

  10. Thank you for this. I am still (slowly) learning my way around HTML and am looking to redo my icons so this was perfectly timed. (found you through The Creative Spark)
    Reply

  19. Good Morning Diana, Thank you so much for this wonderful tutorial, it is such a boon for someone like me who knows a little about the computer, but if I am honest, not a lot.
    It is thanks to Connie, from Family Home an Life that I found your site and have become a new follower. I look forward to your future posts, but I am going backwards to read your older posts.
    I have become a new follower and would like to invite you to visit me at Ivy, Phyllis and Me! It would be lovely if you could visit.
    Best wishes
    Daphne
    Reply

  22. Hi, found you on the Serenity Blog Hop. Fun recommendations, but trying to figure out which would be best for my blog. I am still working on a button too. Any tips on improving the look of my blog would be greatly apprecitated!

    Mary-andering Creatively
    http://mary-anderingcreatively.blogspot.com/
    Reply

  23. I always wondered how this worked! So glad I found this :)

    Just wanted to let you know that my friends Kayla and I have started a link party again. We have our Circle of Faith every Sunday, but have it up by 6pm mountain time on Saturdays. We would love to have you come over and link up and anything and everything you would like to share. We have NO rules! Hope to see you there :)
    http://www.heatherlyloves.com/2013/04/2-circle-of-faith-link-party.html
    xoxo
    Heather
    Reply

  29. So helpful to so many newbie bloggers out there!! Cute buttons =)

    Thanks for linking up to TGIF! Hope to see you linked up again today =)

    Have a great weekend,
    Beth =)
    Reply

  31. Great tutorial, Diana! One thing that I like to do is add an alt tag to the image code. This way when someone hovers over my facebook icon it says, "Facebook" or "Follow me on Facebook!" This is particularly helpful if someone doesn't recognize what the button is representing.

    Happy Friday! :)
    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *