Add The Social Icons With Css Effects To Your Blog
Live Demo 3D Social Buttons
Wordpress Users
Blogger Tutorial
- Go to WordPress Dashboard -> Apperance -> Widgets
- Add A text Widget to Your Sidebar and Paste Given Below Code In It.
- Go to Blogger Dashboard -> Layout -> Click ‘Add A Gadget’ ->HTML Javascript
- Copy Given Below Code and Paste In HTML Javascript Gadget
- It’s All Done Save Your Gadget
<style> #social a:hover {background-color: transparent;opacity:0.7;} #social img { -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; } #social img:hover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } </style> <center><div id=”social”> <!–Start Rss Icon–> <a title=”Grab Our Rss Feed” href=”YOUR-FEED-URL-HERE” target=”_blank”><img border=”0″ src=”http://3.bp.blogspot.com/-JJAnjTFe4mQ/UA6_gexOboI/AAAAAAAAH8w/pUVfxnjRUM4/s1600/RSS-48×48.png” style=”margin-right:1px;” alt=”Icon”/></a> <!–End Rss Icon–> <!–Start Email Rss Icon–> <a rel=”nofollow” title=”Get Free Updates Via Email” href=”YOUR-EMAIL-RSS-URL-HERE” target=”_blank”><img border=”0″ src=”http://4.bp.blogspot.com/-1BWe2ZnJHas/UA6_hrD6_GI/AAAAAAAAH80/exs4JwDuyhY/s1600/RSS-EMAIL-48×48.png” style=”margin-right:1px;” alt=”Icon”/></a> <!–End Email Rss Icon–> <!–Start Facebook Icon–> <a rel=”nofollow” title=”Like Our Facebook Page” href=”YOUR-FACEBOOK-PAGE-URL-HERE” target=”_blank”><img border=”0″ src=”http://4.bp.blogspot.com/-dkmDM3RXcoE/UA6_d28wCyI/AAAAAAAAH8Y/9E3PI3lXueM/s1600/FACEBOOK-48×48.png” style=”margin-right:1px;” alt=”Icon”/></a> <!–End Facebook Icon–> <!–Start Twitter Icon–> <a rel=”nofollow” title=”Follow Our Updates On Twitter” href=”YOUR-TWITTER-URL-HERE” target=”_blank”><img border=”0″ src=”http://3.bp.blogspot.com/-TrNf8cdHE6w/UA6_iRAUK_I/AAAAAAAAH88/Jo7RAX207xo/s1600/TWITTER-48×48.png” style=”margin-right:1px;” alt=”Icon”/></a> <!–End Twitter Icon–> <!–Start Google+ Icon–> <a title=”Follow Us On Google+” rel=”nofollow” href=”YOUR-GOOGLE-PLUS-URL-HERE” target=”_blank”><img style=”margin-right:1px;” src=”http://2.bp.blogspot.com/-VeOVFTKCvHw/UA6_em6-aOI/AAAAAAAAH8c/Uu4blSzFwLk/s1600/GOOGLE-PLUS-48×48.png”/></a> <!–End Google+ Icon–> <!–Start Pinterest Icon–> <a title=”Follow Our Pins” rel=”nofollow” href=”YOUR-PINTEREST-URL-HERE” target=”_blank”><img style=”margin-right:1px;” src=”http://4.bp.blogspot.com/-uSSbLLRLSIE/UA6_fTHiLrI/AAAAAAAAH8k/OxlFAJozvX8/s1600/PINTEREST-48×48.png” alt=”Follow Me on Pinterest” /></a> <!–End Pinterest Icon–> </div><br/> <!–Start Feed Count Button–> <a href=”YOUR-FEEDBURNER-URL-HERE” target=”_blank”><img alt=”spice up your blog” src=”http://feeds.feedburner.com/~fc/spiceupyourblog?bg=ff9933&fg=000000&anim=1″ style=”border:0″ /></a><!–End Feed Count Button–> </center>
<style> #social a:hover {background-color: transparent;opacity:0.7;} #social img { -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; } #social img:hover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } </style> <center><div id=”social”> <!–Start Rss Icon–> <a title=”Grab Our Rss Feed” href=”YOUR-FEED-URL-HERE” target=”_blank”><img border=”0″ src=”http://3.bp.blogspot.com/-JJAnjTFe4mQ/UA6_gexOboI/AAAAAAAAH8w/pUVfxnjRUM4/s1600/RSS-48×48.png” style=”margin-right:1px;” alt=”Icon”/></a> <!–End Rss Icon–> <!–Start Email Rss Icon–> <a rel=”nofollow” title=”Get Free Updates Via Email” href=”YOUR-EMAIL-RSS-URL-HERE” target=”_blank”><img border=”0″ src=”http://4.bp.blogspot.com/-1BWe2ZnJHas/UA6_hrD6_GI/AAAAAAAAH80/exs4JwDuyhY/s1600/RSS-EMAIL-48×48.png” style=”margin-right:1px;” alt=”Icon”/></a> <!–End Email Rss Icon–> <!–Start Facebook Icon–> <a rel=”nofollow” title=”Like Our Facebook Page” href=”YOUR-FACEBOOK-PAGE-URL-HERE” target=”_blank”><img border=”0″ src=”http://4.bp.blogspot.com/-dkmDM3RXcoE/UA6_d28wCyI/AAAAAAAAH8Y/9E3PI3lXueM/s1600/FACEBOOK-48×48.png” style=”margin-right:1px;” alt=”Icon”/></a> <!–End Facebook Icon–> <!–Start Twitter Icon–> <a rel=”nofollow” title=”Follow Our Updates On Twitter” href=”YOUR-TWITTER-URL-HERE” target=”_blank”><img border=”0″ src=”http://3.bp.blogspot.com/-TrNf8cdHE6w/UA6_iRAUK_I/AAAAAAAAH88/Jo7RAX207xo/s1600/TWITTER-48×48.png” style=”margin-right:1px;” alt=”Icon”/></a> <!–End Twitter Icon–> <!–Start Google+ Icon–> <a title=”Follow Us On Google+” rel=”nofollow” href=”YOUR-GOOGLE-PLUS-URL-HERE” target=”_blank”><img style=”margin-right:1px;” src=”http://2.bp.blogspot.com/-VeOVFTKCvHw/UA6_em6-aOI/AAAAAAAAH8c/Uu4blSzFwLk/s1600/GOOGLE-PLUS-48×48.png”/></a> <!–End Google+ Icon–> <!–Start Pinterest Icon–> <a title=”Follow Our Pins” rel=”nofollow” href=”YOUR-PINTEREST-URL-HERE” target=”_blank”><img style=”margin-right:1px;” src=”http://4.bp.blogspot.com/-uSSbLLRLSIE/UA6_fTHiLrI/AAAAAAAAH8k/OxlFAJozvX8/s1600/PINTEREST-48×48.png” alt=”Follow Me on Pinterest” /></a> <!–End Pinterest Icon–> </div><br/> <!–Start Feed Count Button–> <a href=”YOUR-FEEDBURNER-URL-HERE” target=”_blank”><img alt=”spice up your blog” src=”http://feeds.feedburner.com/~fc/BlogsDaddy?bg=ff9933&fg=000000&anim=1″ style=”border:0″ /></a><!–End Feed Count Button–> </center>
Widget Code HereNoteWidget Code HereNotePaul Crowe
