Making your blog unique is a very tough task, in this tutorial am about to share with you, i will discussing on how you can add a cool social sharing icons with a cute CSS3 effect. This icons consist of facebook link, twitter link, you tude link, and google + link. This icons will move by 7 degree when you hover your mouse on it due to the effect that is included. Follow the few steps below on how to add this icons to your blog.

Adding The Icons To Your Blog

STEP 1

Go to your blogger dashboard
Click on "Design" > "Edit HTML" > Back up your template
Mark/Tick "Expand Widget Templates"
Use ctrl F to find </b:skin> and paste the following code before </b:skin> tag

#rb_share_ex {
width: 800px;
margin: 0 auto;
}
#rb_share_ex img {
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
#rb_share_ex img:hover {
-webkit-transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-o-transform: rotate(-7deg);
}

#rb_share_ex ul{
list-style-type:none;
}
#rb_share_ex li{
list-style-type:none;
}

Click "SAVE TEMPLATE"

STEP 2

Go to your blogger dashboard
Click on "Design" > "Page Elements" > "Add a Gadget"
Choose "HTML/JavaScript" from the list of options
Copy and paste the code below in the content box.

To change the height and width of your icon, simply edit all occurrence of 100
Replace https://www.facebook.com/realcombiz with your facebook page url
Replace https://twitter.com/realcombiz with your twitter profile url
Replace https://plus.google.com/117896762172961615212/posts with your google plus profile url
Replace http://www.youtube.com/user/realcombiz/videos with your youtube profile url.
Click "Save". That's all.