• SANTORINI

    SANTORINI

  • SANTORINI

    SANTORINI

  • ZAKYNTHOS

    ZAKYNTHOS

  • LEYKADA

    LEYKADA

  • KEFALLONIA

    KEFALLONIA

  • KERKYRA

    KERKYRA

  • RODOS

    RODOS

GADGETS FOR BLOGS

YouTube GITHUB glitch.com JSBIN Start.me JSFIDDLE CODEPLY PASTEBIN.COM Repl.it CODEPEN CODEPEN

ΠΩΣ ΒΑΖΩ FACEBOOK FLOATING LIKE BOX

ΠΩΣ ΒΑΖΩ FACEBOOK FLOATING LIKE BOX
1) Σύνδεση στον Blogger
2) Διάταξη
3) Προσθήκη Gadget
4) HTML/JavaScript

Και στο κουτάκι προσθέστε τον παρακάτω κώδικα : 



ΚΩΔΙΚΑΣ ΜΕ ΜΙΚΡΟ ΕΙΚΟΝΙΔΙΟ ΚΑΙ ΔΙΑΣΤΑΣΕΙΣ 350Χ220
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
jQuery(document).ready(function() {jQuery(".fb-box").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-350"}, "medium");}, 350);});
</script>
<style>
.fb-box {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipOuq6nZ8isrAgzsNQe7DzJas7-iDQmD5-FsfegfwMh42Bb4lT6kNYXs6LBjgMHitMnDjhkW8rnoP28SJAnYORg7k3BQKgG5OKoAr8Crj0H39oytz8Nhw6sw7dtrxDSnDmFvKFUPiIV0s1/s64-no/Facebook-64.png") no-repeat scroll left center transparent !important;float:right;height:220px;padding: 0 5px 0 46px;width:350px;z-index:  99999;position:fixed;right:-350px;top:5%;}
.fb-box div {padding:0;margin-right:-8px; border:4px solid  #00FF00; background:#115599;}
</style>
<div class="fb-box" style="">
<div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/widgetsforblogs&amp;width=350&amp;colorscheme=light&amp;show_faces=true&amp;border_color=blue&amp;stream=false&amp;header=false&amp;height=220" scrolling="no" frameborder="0" scrolling="no" style="border: blue; overflow: hidden; height: 220px; width: 350px;background:#115599;"></iframe></div></div> 

 ΚΩΔΙΚΑΣ ΜΕ ΜΕΓΑΛΟ ΕΙΚΟΝΙΔΙΟ ΚΑΙ ΔΙΑΣΤΑΣΕΙΣ 450Χ220
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
$(document).ready(function() {$(".fl-box").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-450"}, "medium");}, 450);});
</script>
<style>
.fl-box {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYnXMBhyeR4-YkdUGPmuVzWw6711LrO4SzBWsDEX5v_zHNMI88k54oS6r7vySMe4rIqM0z6NJQHrtDLL4wrhpRmW6M3vy6OLfajg34HxAAqQU3UPuH6xmQixn1o3wGN_yyFMF7C7-WesvR/w41-h136-no/FB-FLOATING.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 220px;padding: 0 5px 0 40px;width: 450px;z-index: 99999;position:fixed;right:-450px;top:5%;}
.fl-box div {border:4px solid  #00FF00; background:#115599;padding:0;margin-right:-8px;}
</style>
<div class="fl-box" style="">
<div>

<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/widgetsforblogs&amp;width=450&amp;height=220&amp;colorscheme=light&amp;show_faces=true&amp;border_color=blue&amp;stream=false&amp;header=false&amp;" scrolling="no" frameborder="0" style="border:blue;height:220px;width: 450px;overflow:hidden;background:#115599;" allowtransparency="true"></iframe></div></div>

Αντικαταστήστε το link που έχει μαρκαριστεί με πράσινο χρώμα με το δικό σας link σελίδας facebook. Μεταφέρετε προαιρετικά το εικονίδιο του facebook που έχω μαρκαρει με μώβ χρώμα σε δικό σας λεύκωμα του blogger.

Αν δεν σας αρέσουν αυτές οι διαστάσεις μπορείτε να τις αλλάξετε πειράζοντας τα γαλάζια γράμματα. Το ίδιο ισχύει και για το χρώμα του backround (#115599;) και για τη θέση του widget (top:5%;)