Ads 468x60px

Friday, 5 April 2013

Spinning Social Icons


Here some stylish social icons for you which give your blog a professional and impressive look. I am also using this social icon and I think its best.
So if you want the same then right place for you.
This is designed with CSS effects and very easy to setup in your blog.
If you are using blogger then just simply copy the following code and go to your blog layout and the select to add a gadget then select HTML/JavaScript and then on the content box paste the code and save.
If you did not get properly then the detailed tutorial is here:
How will it look?

Code for Spinning Social icons
<style>p#hb_socialicons img {
 /* Spinning Social Icons Widget By All Tech Story */
    -moz-transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    -ms-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}
 
p#hb_socialicons img:hover {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}
 
/* Spinning Social Icons By All Tech Story*/
</style> 
 
 
 
<center><p id="hb_socialicons">
    <a href="http://www.facebook.com/AllTechStory">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc5VOJZwVe-kTdomNGdq_nI71pjyZjgV4HX_6bWS4W8kPg8i9umPXmUoFSv7OLBZ-WhOfIEY-u7QsLDwB9v7eTHvBZig0j4zqIZxXllNO2hPRIlyfJA_wXMt-4TNL4wx_0SBaQiorWz8BI/s1600/alltechstory_facebook.png" /></a>
    <a href="http://www.twitter.com/AllTechStory/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibZIz5AcgO0AvqHTnO4Lyd08FnLZsbz-7GjCIAOHzG9G78OY_XYHK9aNJCAEj7FcjVfQHK0JEMSZO0phck2x7i_lz1rzyD1UtB5VfMzjNz0FmN8lJ0cdSExAyV5hOrzmeJ-MLSyGA3kyg0/s1600/alltechstory_twitter.png" /></a>
    <a href="https://plus.google.com/u/0/106527290580119996124">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQxGSl_iaUuHWIO_eBhHSRd00YzX0S3cGbYNosNN8_pHIGM8v14J-mBk4JueAZmjwVN1kxfcIh7_QaW5nhmp4OXDLmCQhluYLjawXBt8fvLIF2_Orm-kDtxpzzUQ6NnR3wwl8od3MSwh5x/s1600/alltechstory_googleplus.png" /></a>
    <a href="http://www.feeds.feedburner.com/AllTechStory/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEtq3WopyiUJIT9uB5NqMQ-uAOOnpbNCNaXwHkdzy1Z7oUbMcVmqhyphenhyphennkIv0t-QXUS3zHEXB4pkR-BFQwjotBgiX26C6gaUfcGNy-S9tuoYD-BUzobDTQ6bENz0uk5ERIFGwp3cuPIE6bTd/s1600/alltechstory_rss.png" /></a>
    <a href="http://www.youtube.com/AllTechStory/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWB7SSZq-27gmXhyjXIMkW-wrxkHmovt_w06cBKh1Sb9Ffh2T9REnUk_JMm0pbph0FshJ9mYAWDHmPs_B-7ge0iJw7IPOPqte3WHejcxvDl2AvHHM_PuGjNdXrppxq2qu0jhJhmYpDd_tn/s1600/alltechstory_youtube.png" /></a>
</p></center>
How to Implement It?
  • Go to blogger
  • Select Layout from the left side menu
  • Click on Add a Gadget
  • Select HTML/JavaScript
  • Past the above code in the content box
  • Save
Share if you liked this Post using your favorite sharing service:

Subscribe Updates, Its FREE!

 
Related Posts Plugin for WordPress, Blogger...