Ads 468x60px

Τρίτη, 6 Αυγούστου 2013

3D Social Icons

Γειά σας άλλο ένα πολύ ωραίο widget  με social icons  θα δούμε σε αυτήν την
ανάρτηση.Έχει πολύ ωραίο εφέ όταν περνάμε τον κέρσορα πάνω από τα εικονίδια,
ομορφαίνει τα blog μας  και είναι εύκολο στην εγκατάσταση του ακολουθώντας την
γνωστή διαδικασία!!!

Πηγαίνετε blogger--> Διάταξη -->

Προσθήκη gadget-->HTML/JavaScript 

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

........................................................................................................................................

<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-48x48.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-48x48.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-48x48.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-48x48.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-48x48.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-48x48.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>

...................................................................................................................................

Απλά αλλάξτε όλα τα υπογραμμισμένα πλαίσια με τις δικές σας αντίστοιχες
διευθύνσεις των social media και πατήστε Αποθήκευση!!

Εάν θέλετε να αφαιρέσετε κάποιο εικονίδιο πχ το Pinterest αφαιρείτε από τον κώδικα
από εδώ:<!--Start Pinterest Icon-->  μέχρι εδώ:  End Pinterest 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-48x48.png" alt="Follow Me
on Pinterest" /></a> <!--End Pinterest Icon-->
Καλή επιτυχία!!!

Demo

Πηγή κώδικα


Edit by vaiol!!!!!

0 σχόλια :

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

Icon Icon Icon

spice up your blog