Wednesday, April 18, 2012

POSTING SOCIAL MEDIA ICONS ON BLOGGER...TAKE TWELVE cont.

Yesterday, I promised that I would share a step by step tutorial on how to post these lovely little buttons on blogger.  I'm a visual learner so I thought I would map it our with pictures... Enjoy!

First create a  Photobucket (or something similar) account.  It's free!  Save all the images of you social media buttons there.  You'll ultimately link to that site to get the image you show as your button.

After you save your images, take the following steps:
  1.  Go to layout on your blogger dashboard
  2. Choose to add a gadget
  3. Choose the HTML/Java Script option and click the + sign


4. Once you open up the gadget you change the choice to edit the HTML.  You can cut and paste the below HTML code (I recommend doing in a word doc so you can play around with it for each button you create (i.e. FB, RSS, Twitter, Pinterest, etc.) for use.  The blue and red below is where you will put your customized info.

<ahref="https://www.facebook.com/pages/your fb page name/xxxxxxxxxxxx"><img style="width: 87px; height: 81px;" src="http://ixxxx.photobucket.com/albums/xxx/your image name/facebookfinal-1.jpg" height="26" /></a>

5. The blue will be a simple cut and paste of your custom FB (or Twitter, RSS, Pinterest, etc.) page's URL.  I kept messing up because I deleted the " " marks.  Don't do that J

For the red - you go to your Photobucket account.  Copy the Direct Link HTML script and paste it in between the " ".  


Now lather, rise, and repeat for the other social media buttons.  Don't be fooled by my confusing pics above, I realized too late that the HTML says FB while the Photobucket page shows Pinterest... You're all smart cookies, you get the point!

Hope this was helpful.  Happy posting!

1 comment:

  1. I promised that I would share a step by step tutorial on how to post these lovely little buttons on blogger. graphics pack download

    ReplyDelete