Bloggy Help:

 photo socialmedia_zps413c1040.png  photo helpdeskbutton_zpsb16b6c42.png  photo instagram_zps73b3c07a.png  photo header_zps97df3d3e.png  photo needamakeover_zps6d19d8a9.png

More Advice on Social Media Icons




Adding social media/networking icons to your site is standard for blogs nowadays and important for giving your readers the ability to connect with you and  share you with others.  What's even more fun than just adding boring old icons (did I say that?) is adding really cute ones that match your blog design and tastes.

Many blog designers will create custom icons to go with your blog if you order their services. You can find some adorable designs on Etsy that are very affordable (like $2!)  However, if you are trying to be more thrifty when you are beginning blogging you can find FREE social media icons easily by using the search terms "social media icons" on your favorite search engine. And of course, don't forget your Pinterest button...Pinterest is your friend!
Free icons from April Showers

Here is a really nice list of icons at http://www.iconarchive.com
And here's an extensive list of places to find icons at Makin' Cute Blogs

How to install icons on Blogger:
  1. Download the icon set you wish to use (or right click and save to your desk top)
  2. If there is a .zip file, "unzip" it and open the folder (create an "icon" folder for easier retrieval)
  3. Decide which icons you wish to use and upload to a site like Photobucket to create the HTML code
  4. In Blogger Design add an HTML widget
  5. Copy and paste the image code of the icon you have chosen using the code from PHOTOBUCKET into the new HTML widget. Not sure how to use Photobucket? We have pre-hosted icons HERE. Click HERE to learn about rearranging and resizing your sidebar icons and buttons.
  6. Select (highlight) the icon image and click the link to button to add the link to the "social network" associated with the icon.  For example, for a Twitter icon you will link it to your twitter URL (e.g. http://www.twitter.com/BlogGuidebook links to the @BlogGuidebook account).
  7. Drag and drop the widget to the location you prefer.
  8. Click Save (very important)
  9. Review how everything looks and you're done! (If you need help lining up your buttons please drop us an email and we will help you!)
****EXTRA TIP: There's an easy way to add a link to your email icon. 
Use the BOLDED code: mailto:youremailaddress@youremailaddress.com in the LINK field.
CREATE LINK ICON
 
 ie. click on the email icon image, then click the CREATE LINK icon, and type in the mailto: plus your email address...make sense?)

Read our original post on Social Media Icons. 

    38 comments:

    1. Thanks so much...but the April showers link is coming up as non-existent.

      ReplyDelete
      Replies
      1. You can still right click and save these icons for use.

        Delete
    2. Always appreciate your tips doll.

      By the way--have you heard that my 1st novel is being released on Amazon.com tomorrow?! Check it out on my blog! Have a wonderful Cinco De Mayo honey! Kori xoxo

      www.blondeepisodes.com

      ReplyDelete
    3. Oh, thank you so much! I have been trying to make some simple links from my blog, but haven't been sure how... Now I know!
      I might just try this!

      ReplyDelete
    4. Thanks for your comments! I'm glad it was helpful. Sorry that the link didn't work originally. Thanks Sarah for fixing it!

      ReplyDelete
    5. oh my gosh! I just found some more cute freebies: http://ritzydesign.com/freebie-web-2-0-social-icons-freebie/

      ReplyDelete
    6. I've been trying to figure this out on my own all day but I still don't understand how to do Step 6+7! Can you explain that a bit more because I really don't like the way my buttons looks currently!

      ReplyDelete
    7. I need to work on some of mine. These will help.

      ReplyDelete
    8. This is great!
      I have blogger and I really despise the teeny, invisible share buttons they have at the bottom of each post. Do you have any idea how to change THAT?

      ReplyDelete
      Replies
      1. Hmmm...that's a good question Luci! Never thought of actually changing them...I'm sure there is a way to enlarge them...but I think your best bet would be to delete them and create your own. Good luck! I'll see if I can find anything out about the change.

        Delete
    9. Replies
      1. I'll see if I can find a wp tutorial for you!

        Delete
      2. Here's a plugin for you...you can customize the URL to use your own image too...http://wordpress.org/extend/plugins/tipsy-social-icons/

        Delete
      3. Here's another plugin that might be even better...http://wordpress.org/extend/plugins/social-media-widget/

        Delete
    10. I find commenting on blogger blogs to be a PITA so I voted for moving to wordpress :)

      ReplyDelete
      Replies
      1. Commenting isn't that hard to do, it's the annoying word verification. Turn it off already people!

        Delete
    11. thanks for this post! will have to give it a shot...

      ReplyDelete
    12. Here's some more adorable icons...from Besotted Brand Blog: http://www.besottedblog.com/2012/08/free-social-iconsparcel-inpsired.html

      ReplyDelete
    13. This is really Helpful!Thank You for the post :)

      Xo

      ReplyDelete
    14. This was extremely helpful, before I found this post I had NO idea what I was doing, and it all worked out well enough! I may have to change icons later on but for now I'm pretty pleased with even having working links on my blog! Thanks!!!

      ReplyDelete
      Replies
      1. It's easy to find more icons on the web for free, or check out Etsy for really cute affordable icons.

        Delete
    15. Hello! I find your posts so helpful! I'm a fellow blogger and my blog is called "My Sweet Mission" wwww.My-Sweet-Mission.com.

      I'd love to know how to make my icons line up horizontally instead of vertically when creating them? Any tips would be really appreciated!

      Thank you,
      Heather

      ReplyDelete
      Replies
      1. Not sure what you're asking but I found this site that makes a vertical floating social media bar for you: http://www.floatingsocialmediabuttons.com/

        I will check out your blog and see if I can figure your question out.

        Delete
      2. HI again Heather, I checked out your blog and I totally see what you mean. I want to email you an example of the code on from one of my blogs, as I can't add it in the comment section...the blog is www.differentdog.com

        Just remember to not have center in between buttons and they should line up perfectly for you, also depending on how much white space is around the buttons when created. I got mine on Etsy.

        Delete
    16. Thanks for the info and website Sarah! I'm sure I can figure it out! :)

      ReplyDelete
    17. Hi Sarah. Well, I did it. The problem was my icons were too big (48 x 48). When I used 32 x 32 icons, it worked perfectly! Check them out and let me know what you think!

      Thanks again!

      ReplyDelete
      Replies
      1. Awesomeness! I forgot about that aspect...if you're using Firefox you can drag the icons to the size you need too (when you're in your sidebar).

        Delete
      2. Sarah and Heather I still trying to figure out how to line the icons vertically. Help!!!

        Delete
      3. Hi Julieta. I created a post (don't publish it though) with the icons in a row and with their URLs linked. Got the HTML code from that post and put the code on the side bar as a HTML gadget. Hope this helps.

        Heather
        My-Sweet-Mission.com

        Delete
    18. Thank you very much for you instruction :) I've been trying to do this for few hours... It took me 2 mins to successfully add social icons on my blog using your steps.

      ReplyDelete
    19. Hello, I can't quite figure out where the link button is. I pushed the link button after highlighting the code and then tried to link it to my pinterest and facebook. That did not work. How do I link it?

      http://makingmemoriesofus2012.blogspot.com/

      ReplyDelete
    20. So thankful to have found your site :)

      ReplyDelete
    21. Hi I'm trying to add a social media button to my website. They are located in my HTML code though, NOT in my side bar. How do I go about editing my HTML to add a button?

      ReplyDelete
    22. Can you share with me how to align them side by side... thank you!

      ReplyDelete
    23. Thank you for this tutorial! I got it to work on my blog, and I love it.

      ReplyDelete

    Comments are how we stay connected as bloggers. Let us know how you feel and we'll return the favor...stay calm and blog on!!! And guess what? You'll never find Word Verification on our blog...it gets kind of annoying when you can't read what WV wants you to verify right?

    Note: Only a member of this blog may post a comment.

    Outbrain