5.12.2012

Social Media Icons


For my awesome readers...more social media icons! If you missed the last set, view them HERE!

Here's a set of gray and white icons.  The first set are a little bigger...75x75, and the second set are smaller 50x50. Note...these codes are for the button only, you will need to link each one to each of your social media sites by way of "Rich Text" inside your HTML gadget.  See the end of this post for a mini-tutorial!

75x75

GrayWhiteButtonFacebook1GrayWhiteButtonTwitterGrayWhiteButtonPinterest-2GrayWhiteButtonRSS1GrayWhiteButtonGoogleGrayWhiteButtonEmailGrayWhiteButtonBL

Facebook:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonFacebook1.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonFacebook1.jpg" border="0" alt="GrayWhiteButtonFacebook1"></a>
Twitter:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonTwitter-1.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonTwitter-1.jpg" border="0" alt="GrayWhiteButtonTwitter"></a>
Pinterest:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonPinterest-2-1.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonPinterest-2-1.jpg" border="0" alt="GrayWhiteButtonPinterest-2"></a>
RSS:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonRSS1.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonRSS1.jpg" border="0" alt="GrayWhiteButtonRSS1"></a>
 Google+:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonGoogle-1.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonGoogle-1.jpg" border="0" alt="GrayWhiteButtonGoogle"></a>
Email:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonEmail-1.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonEmail-1.jpg" border="0" alt="GrayWhiteButtonEmail"></a>
 BlogLovin':
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonBL-1.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonBL-1.jpg" border="0" alt="GrayWhiteButtonBL"></a>

50x50 

GrayWhiteButtonFacebookGrayWhiteButtonTwitterGrayWhiteButtonPinterest-2GrayWhiteButtonRSSGrayWhiteButtonGoogleGrayWhiteButtonEmailGrayWhiteButtonBL

Facebook:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonFacebook-1.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonFacebook-1.jpg" border="0" alt="GrayWhiteButtonFacebook"></a>
 Twitter:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonTwitter-2.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonTwitter-2.jpg" border="0" alt="GrayWhiteButtonTwitter"></a>
Pinterest:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonPinterest-2-2.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonPinterest-2-2.jpg" border="0" alt="GrayWhiteButtonPinterest-2"></a>
 RSS:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonRSS-1.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonRSS-1.jpg" border="0" alt="GrayWhiteButtonRSS"></a>
 Google +:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonGoogle-2.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonGoogle-2.jpg" border="0" alt="GrayWhiteButtonGoogle"></a>
 Email:
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonEmail-2.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonEmail-2.jpg" border="0" alt="GrayWhiteButtonEmail"></a>
BlogLovin':
<a href="http://s820.photobucket.com/albums/zz125/CreatedbyAshley/?action=view&amp;current=GrayWhiteButtonBL-2.jpg" target="_blank"><img src="http://i820.photobucket.com/albums/zz125/CreatedbyAshley/GrayWhiteButtonBL-2.jpg" border="0" alt="GrayWhiteButtonBL"></a>

I am working on more different colors, styles, sizes, and social media sites, so stay tuned and keep checking back! 

If any of the codes don't seem to work, send me an email at thelatestfind@gmail.com and I'll try to help ya! For instructions on linking these codes to your social media sites, scroll down a little for a mini tutorial.

If you missed the free icons posted yesterday, click HERE to view those!
These are for your own website only, not to be re-distributed or sold!
Hope you're having a great weekend, and Happy Mother's Day to all the moms!

Stay tuned for more finds!


Mini Blogger tutorial on how to link your icons to your social media sites:

From your layout, add a gadget. In the options, choose HTML/Javascript.  Enter any of the html codes above, depending on which social media site buttons you want.
(click on the pic to view it bigger).
 In the above pic, I have pasted 3 html button codes (all twitter...just for the tutorial).  Then click "Rich Text" where the blue arrow is pointing in the above pic.  That will transform your codes into picture form.  
Choose the icon you want to link first to highlight it.  Then, click on what looks like a globe wearing sunglasses (where the blue arrow is pointing in the above pic). That will bring up a box where you will put the web address to the icon you clicked on.
If you highlighted your Facebook icon, you will put the web address to your Facebook page in this blue box. Then click OK.  Then click your next icon to highlight it, and click the globe with sunglasses again. Put in the corresponding URL address (Twitter icon to Twitter page, Pinterest icon to Pinterest page, etc). Once you have linked all your icons to the corresponding web addresses, click Save.






5 comments:

  1. Thank you SO MUCH for this tutorial!!!!!! I am very new to blogging and don't know anything about HTML so this is a life saver

    ReplyDelete
  2. Hi Ashley! Thanks so much for your comment on my blog. I am having a hard time using the email icon. I try to changing it like the others but it does not seem to work.Am sure am doing something wrong. Please help.
    thanks!

    ReplyDelete
  3. Yay! Thank you so much for this! Super helpful! The only thing I can't figure out how to do is link up the e-mail icon...any suggestions? Thanks!

    ReplyDelete
  4. this helped me so much!!! thanks for posting

    ReplyDelete
  5. Thank you!!! I've been going crazy trying to find a way to do this on my blog. Finally! Duh!

    ReplyDelete

We're so appreciative of your comments! Thanks so much for visiting!

Connect

AppRSS AppGoogleplus AppBloglovin

Add to Google
bloglovin