Floating Facebook Like Box για τον Blogger. |  Στάλες στο γαλάζιο ® <link href='https://2.bp.blogspot.com/-22E26JkdNKM/WQ8SfpxYoyI/AAAAAAAAgIQ/k4VTghvdD9Q7yyuGhJaAS3E-EqO4PfLJwCLcB/s72-c/Floating_Facebook_Like_Box_For_Blogger.jpg' rel='https://4.bp.blogspot.com/-ucvLyH7G8ns/WNrpJ42EDOI/AAAAAAAAfwo/V5doGhzXC8QztinTcD9Jfy_YBPCPzpPOgCLcB/s640/Stales_sto_Galazio.jpg'/>

0
Στη ανάρτηση αυτή θα δούμε πως μπορούμε να προσθέσουμε στο ιστολόγιο μας ένα facebook like box.
Τα Πλεονεκτήματα του αρκετά δελεαστικά.

1.)
Eξοικονομείτε πολύτιμο χώρο στο sidebar σας
2.) Tο likebox βρίσκεται πάντα στο οπτικό πεδίο του αναγνώστη έτσι μπορείτε να αυξήσετε τα likes του facebook fan page σας.

Η τοποθέτηση του είναι απλή:


Αφού κάνετε σύνδεση στον blogger, θα πάτε στον Πίνακα ελέγχου σας --> Διάταξη --> Προσθήκη gadget και θα κοιτάξετε να βρείτε το HTML/JavaScript.


Κάντε αντιγραφή τον παρακάτω κώδικα και επικολλήστε τον μέσα στο HTML/JavaScript.


<!--Floating-Facebook-Like-Box-STARTS-Widget-by-http://loneeagle110.blogspot.com-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.floatinglikebox{
background: url("https://4.bp.blogspot.com/-r3cGfmXXnsM/WTLotJ07ZRI/AAAAAAAAgas/p7bK5NlgXE8E2hnDwdVij6CFfzu7vJhowCLcB/s1600/floatingfble.png") no-repeat scroll left center transparent !important;
display:block;
float:right;
height:220px;
padding:0 5px 0 40px;
width:245px;
z-index:99999;
position:fixed;
right:-250px;
top:10%;}
.floatinglikebox div{
border:none;
position:relative;
display:block;}
.floatinglikebox span{
bottom:10px;
font:10px tahoma,verdana,arial,sans-serif;
position:absolute;
right:6px;
text-align:right;
z-index:99999;}
.floatinglikebox span a{
color:#808080;
text-decoration:none;}
.floatinglikebox span a:hover{
text-decoration:underline;}
</style><div class="floatinglikebox" style="">
<div>
<iframe src="//www.facebook.com/plugins/likebox.php?
href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Σταλες-στο-Γαλαζιο-112539732132843&
width=251&height=220&colorscheme=light&show_faces=true&
border_color=%23fffff&stream=false&header=false&" scrolling="no" frameborder="0" style="border:none;overflow:hidden;width:251px;height:210px;background:#fff;" allowtransparency="true">
</iframe><span><a href="https://goo.gl/oZxYwB" target="_blank">Get this</a></span>
</div></div>
<!--Floating-Facebook-Like-Box-STOPS-Widget-by-http://loneeagle110.blogspot.com-->

Αυτό ήταν!!!

Ο παραπάνω κώδικας μόλις σας πρόσθεσε ένα floating like box του Στάλες στο γαλάζιο.
Για να προσθέσετε το δικό σας, ανοίξτε σε ένα νέο tab το facebook fan page σας:

H διεύθυνση του fan page σας φαίνεται στο address bar του browser σας και είναι της μορφής:
http://www.facebook.com/pages/όνομα_του_fan_page_σας/ID_του_fan_page

Αντικαταστήστε το www.facebook.com%2Fpages%2Σταλες-στο-Γαλαζιο-112539732132843 με το όνομα_του_fan_page_σας και το id του Στάλες στο γαλάζιο, με το ID_του_fan_page_σας.

To URL του κώδικα σας θα πρέπει να είναι της μορφής:
href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Fόνομα_fan_page_σας%2Fid_fan_page

Αυτό ήταν!

ΠΡΟΣΟΧΗ ! ! !
Αν έχετε ήδη το script 1.6.1/jquery.min.js μπορείτε να μην αντιγράψετε τις πρώτες 2 γραμμές έτσι ώστε να μην φορτώνετε δυο φορές το jquery.
Στο σημείο top:10%, ρυθμίζεται επί της % το που ακριβώς θα εμφανίζεται η εικόνα του facebook που θα παίζει το ρόλο του κουμπιού αφής.
Δηλαδή, μόλις περνάει ο κέρσορας θα ανοίγει το gadget.

Δείτε το στην πράξη


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

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

Παρακαλώ, την προσοχή σας ! ! !

* Εάν εντοπίσετε κάποιο πρόβλημα σε κάποια δημοσίευση (μη ενεργός συνδεσμος λ.χ. ή οτιδήποτε άλλο), παρακαλούμε κάντε τον κόπο να γράψετε στα σχόλιά σας, το οποιοδήποτε πρόβλημά σας, ώστε να προβούμε στην άμεση διόρθωσή του.
Επίσης, μπορείτε να αποστείλετε ένα "Ευχαριστώ" προς όσους ασχολήθηκαν & σας προσέφεραν ένα... κομμάτι από τη γνώση τους.

Παράκληση προς τους φίλους αναγνώστες-σχολιαστές:

* Να αποφεύγετε να γράφετε με greekglish γιατί τα σχόλιά σας ΔΕΝ θα γίνονται δεκτά.
* Αποφεύγετε το spamάρισμα στα σχόλια. - Please don't spam me!
* Σε περίπτωση που δεν έχετε καταλάβει κάτι, επικοινωνήστε μαζί μας μέσα από την φόρμα των σχολίων και θα σας απαντήσουμε σε εύλογο χρόνο, γι' αυτό ΜΗΝ καταφεύγετε στη αποστολή e-mail για τις όποιες απορίες σας.
* Χρησιμοποιήστε το Reply (που βρίσκεται κάτω από την εικόνα χρήστη), αν θέλετε να του απευθύνετε το λόγο, ή να απαντήσετε σε προυγούμενο σχόλιο.
* Το μέγιστο όριο χαρακτήρων είναι 4.096
* Τα σχόλιά σας θα δημοσιεύονται μετά τον απαραίτητο έλεγχο.

Σημείωση: Όσοι θέλετε να παίρνετε ειδοποιήσεις για τα σχόλια που κανετε, μην ξεχάσετε να τικάρετε το κουμπί "Να λαμβάνω ειδοποιήσεις"

Σας Ευχαριστούμε για την κατανόηση και την επίσκεψή σας.!

 
Top
Blogger Tutorials

Δημιουργήστε τώρα ένα ιδανικό ιστολόγιο, χωρίς να ξοδέψετε ούτε 1€.Περισσότερα από 500 tutorials είναι στη διάθεσή σας.
Οι διαχειριστές του ιστολογίου «Στάλες στο γαλάζιο» σας συμβουλεύουν...
Αποφεύγετε την οποιαδήποτε προσφερόμενη "βοήθεια" από τυχάρπαστους και κατ' επίφαση "web designers", που από ιδιοτέλεια και μόνο προσπαθούν να εκμεταλλευθούν την άγνοιά σας!!!
Με εκτίμηση
«Στάλες στο γαλάζιο»
:-)