Today i,m going to share a social widget which is used in spiceupyourblog.com . It is a beautiful widget with hover effect and when your cursor point on it, it rotates 360 degree and create a beautiful essence on your readers mind. This widget is created by the admin of spiceupyourblog.com . I just try to create a widget like that . Social widget is always the first choice of blogger because it bright your online presense and make you popular among peoples. Now watch the demo of the social widget below
|
Social widget for blogger |
Without these widgets your blog not shine on the right way because these widgets are the main widgets So, wanna add this follow my steps.
Installation:
- Goto blogger dashboard
- now Goto layout tab
- add a gadget and select html/javascript
- Now paste below codes in the html/javascript box
<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>
<div id="social"><a title="Grab Our Rss Feed" href="http://feeds.feedburner.com/haseebnetwork" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4LqZ2dkxKXqFKw7_dZLwuk2J5YxUTMHUhhyphenhyphentOnAO6yUfXCC5uhFpHMV_sRE_Gr3EP5KvulSMITn__Oauk8Gld9sf_DpjlrpTMwQ-YX0Mnu2IyP-Qd3WTTRxsfjlU9x8N4q5ZfsmG8XcV7/s1600/RSS-48x48.png" style="margin-right:1px;" alt="Icon"></a><a rel="nofollow" title="Get Free Updates Via Email" href="lovelykid.haseeb@gmail.com" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIQELAJKmsvleR7jUJDRMNlJEXKkMv0_eTya0bpnSNTC7FVIsDBAeo0fT6UrS-R-2XQn5mDy1a_5QKaHsVmvI3bpYGo8GtatN-D4oy4-IIF2Lk-Sp6VgypQL-rKln_3nhZRhHipZr_1iAk/s1600/RSS-EMAIL-48x48.png" style="margin-right:1px;" alt="Icon"></a><a rel="nofollow" title="Like Our Facebook Page" href="https://www.facebook.com/undefeatablewarrior" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPIRHs2JkHi0BypSiqLkXEAutoUe5A9ww3Il15VMdnHzxj4cDebEO4YtkVy5Dx7G6UGTUWVFe6-9OIBjfjunllQERuluU_EHyKN7UgTKjgQbrFQ_eyjSEVmJehYgo97japF-6SptaWhOx_/s1600/FACEBOOK-48x48.png" style="margin-right:1px;" alt="Icon"></a><a rel="nofollow" title="Follow Our Updates On Twitter" href="http://www.twitter.com/carelexxmalik" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTlmMdkmRsD-r2WD_p6yIVBfmGX7WHdl5jUQ8aVYiIMAQV4QQZ55kAyICAZ2nmtdv_XwaVxXdRXvlDEl-Sq0W5uvpVZHK7OQ0IRJdp9JJO2IAcIrDCrXmibzKlUl_i6Zb-gfu1SLeqNcRx/s1600/TWITTER-48x48.png" style="margin-right:1px;" alt="Icon"></a><a title="Follow Us On Google+" rel="nofollow" href="https://plus.google.com/" target="_blank"><img style="margin-right:1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8PYcqeDPcn2WlddWB4d1nbAIQNfyJaIDW4RagmESZSvDRIbBR4cboxHC7H8qx7EEbMG9DO7g08F-k0LSAUgP_TjHFef5zUIzTyBN33cgg776zQcdXs6GyufLfJ1HjLppXNSz-48yVx0xf/s1600/GOOGLE-PLUS-48x48.png"></a><a title="Follow Our Pins" rel="nofollow" href="http://pinterest.com/carelexxmalik" target="_blank"><img style="margin-right:1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghQ_k-6jJM3Tbbt5PgP8j9k2G8V7LCwDnnvfhJ7BJB6pJ2aPntyNdkgjtEwuVdbTpoBQd-60ysrPUXsXvGLollshwI0Id_MUcZWZueTw8ex8RtgplFWGI3asH9g_KF3B9uZJQ0LXuXm04a/s1600/PINTEREST-48x48.png" alt="Follow Me on Pinterest"></a></div>
- Now change all the links with your social links
- Then save it and its done
If you enjoy our widgets then please take a minute to share them with your friends and thank you for visiting our blog keep visiting daily and find new widgets.
No comments:
Post a Comment