Ads 468x60px

Δευτέρα, 22 Ιουλίου 2013

Social Icons For Blogger

Με τον βομβαρδισμό της ιντερνετικής μας καθημερινότητας και όχι μόνο από τα
social media, συνέχεια βγαίνουν καινούργια gadgets & widgets που ομορφαίνουν τα
blog μας,και βοηθώντας τους φίλους και αναγνώστες μας να μας ακολουθούν ευκολό-
τερα!
Ενα πολύ όμορφο gadget με social buttons
θα δούμε σε αυτήν την ανάρτηση το
οποίο έχει και πολύ ωραίο hover efect!



 Η εγκατάσταση είναι πάρα πολύ απλή!


Πηγαίνετε blogger--> Διάταξη -->
Προσθήκη gadget-->HTML/JavaScript 

και στο παράθυρο που θα ανοίξει βάλτε τον παρακάτω κώδικα--> 
....................................................................................................................................


<!--Rss Feed-->
<a class="spice-popout" rel="nofollow" href="RSS-FEED-URL-HERE" target="_blank"><img src="http://i.imgur.com/7lsUogp.png" /></a>
<!--Email-->
<a class="spice-popout" rel="nofollow" href="EMAIL-URL-HERE" target="_blank"><img src="http://i.imgur.com/oJeNikj.png" /></a>
<!-- Google Plus-->
<a class="spice-popout" rel="nofollow" href="GOOGLE-PLUS-URL-HERE" target="_blank"><img src="http://i.imgur.com/F70aY6r.png" /></a>
<!--Facebook-->
<a class="spice-popout" rel="nofollow" href="FACEBOOK-URL-HERE" target="_blank"> <img src="http://i.imgur.com/g4KQ38R.png" /></a>
<!--Twitter-->
<a class="spice-popout" rel="nofollow" href="TWITTER-URL-HERE" target="_blank"> <img src="http://i.imgur.com/rRbcRlQ.png" /></a>
<!--LinkedIn-->
<a class="spice-popout" rel="nofollow" href="LINKEDIN-URL-HERE" target="_blank"><img src="http://i.imgur.com/dofbMIX.png" /></a>
<!--YouTube-->
<a class="spice-popout" rel="nofollow" href="YOUTUBE-URL-HERE" target="_blank"><img src="http://i.imgur.com/OukhzWK.png" /></a>
<!--Skype-->
<a class="spice-popout" rel="nofollow" href="SKYPE-URL-HERE" target="_blank"><img src="http://i.imgur.com/8c35IfD.png" /></a>
<style>
.spice-popout{height:48px; width:48px; margin:10px; float:left; display:inline-block; -webkit-transition:all ease 0.5s; -moz-transition:all ease 0.5s; -o-transition:all ease 0.5s; -ms-transition:all ease 0.5s; transition:all ease 0.5s}
.spice-popout img{border-radius:50%; margin:8px; width:100%; box-shadow:0px 0px 4px 1px rgba(0,0,0,0.8); -webkit-transition:all ease 0.5s; -moz-transition:all ease 0.5s; -o-transition:all ease 0.5s; -ms-transition:all ease 0.5s; transition:all ease 0.5s}
.spice-popout img:hover{margin:0px; box-shadow:6px 6px 4px 4px rgba(0,0,0,0.3)}
</style>
........................................................................................................................................................

Αντικαταστήστε τα κεφαλαία με τα αντίστοιχα δικά σας urls πατήστε αποθήκευση
και είστε έτοιμοι!!

Demo

Πηγή http://www.spiceupyourblog.com


Καλή επιτυχία!!

Edit by vaiol!!!

0 σχόλια :

Δημοσίευση σχολίου

Icon Icon Icon

spice up your blog