Floating Facebook Like Box for Blogger [2]
Σελίδα 1 από 1 • Μοιραστείτε
[Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.]
Αναφέρομαι στο κανονικό Facebook Like Box αλλά σε πλάγιο μεγάλο κουμπί.
Είναι πιστεύω ένα αρκετά χρήσιμο Gadget που πρέπει να έχει κάθε blog, αφού:
Πάμε όμως να δούμε πως θα το εγκαταστήσετε στο blog σας:
1) Σύνδεση στον [Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.]
2) Πρότυπο
3) Δημιουργία αντίγραφου ασφαλείας / Λήψη πλήρους προτύπου
4) Επεξεργασία HTML
5) Συνέχεια
6) Πατάμε CTRL + F και εκεί ψάχνουμε τον παρακάτω κώδικα:
</head>
7) Αφού το βρούμε , ακριβώς από πάνω , κάνουμε επικόλληση τον παρακάτω κώδικα:
9) Στην συνέχεια, πατάμε Διάταξη > Προσθήκη Gadget > HTML/JavaScript
Τώρα θα πρέπει να αλλάξετε το iframe που είναι με κόκκινα γράμματα με το δικό σας
Για να δημιουργήσετε ένα τέτοιο iframe θα πρέπει να πατήσετε [Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.]
Το iframe σας θα πρέπει να έχει τα εξής χαρακτηριστικά:
Και στην συνέχεια πατάμε στο κουμπί [Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.]
10) Κάνουμε αντικατάσταση τα κόκκινα γράμματα με το καινούργιο iframe που πήραμε
11) Αποθήκευση και τέλος
[Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.]
Αναφέρομαι στο κανονικό Facebook Like Box αλλά σε πλάγιο μεγάλο κουμπί.
Είναι πιστεύω ένα αρκετά χρήσιμο Gadget που πρέπει να έχει κάθε blog, αφού:
- Εξοικονομείτε αρκετό χώρο για την sidebar σας που είναι σημαντική για κάθε blog.
- Κερδίζετε Likes κάνοντας το Facebook Like Box πιο φανερό στους επισκέπτες σας.
Πάμε όμως να δούμε πως θα το εγκαταστήσετε στο blog σας:
1) Σύνδεση στον [Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.]
2) Πρότυπο
3) Δημιουργία αντίγραφου ασφαλείας / Λήψη πλήρους προτύπου
4) Επεξεργασία HTML
5) Συνέχεια
6) Πατάμε CTRL + F και εκεί ψάχνουμε τον παρακάτω κώδικα:
</head>
7) Αφού το βρούμε , ακριβώς από πάνω , κάνουμε επικόλληση τον παρακάτω κώδικα:
- Κώδικας:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/><script type='text/javascript'>jQuery(document).ready(function(){jQuery("#facebook_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#facebook_right").stop(true,false).animate({right: -304}, 500); });jQuery("#twitter_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#twitter_right").stop(true,false).animate({right: -304}, 500); });jQuery("#google_plus_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#google_plus_right").stop(true,false).animate({right: -203}, 500); });jQuery("#feedburner_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#feedburner_right").stop(true,false).animate({right: -303}, 500); }); });</script>
9) Στην συνέχεια, πατάμε Διάταξη > Προσθήκη Gadget > HTML/JavaScript
- Κώδικας:
<style>#facebook_link {float:right; padding-right:5px;margin-top:-58px;}#on {visibility:visible;}#off {visibility:hidden;}#facebook_div {width:300px; height:335px; }#facebook_right {z-index: 10005;border:2px solid #3b5998;background-color: #fff;width:300px;height: 335px;position: fixed;right: -304px;}#facebook_right img {position: absolute;top: -2px;left: -40px;}#facebook_right iframe {border:0px solid #3c95d9;overflow: hidden;position: static;height: 360px;left:-62px;top:-3px;}</style><div id="on"><div id="facebook_right" style="top: 15%;"><div id="facebook_div"><img src="http://2.bp.blogspot.com/-MfikPju8cfM/UDaQ9xnOhiI/AAAAAAAAAZw/b7TyuHT1Vqw/s200/fb2-right.png" alt="boton facebook flotante" />
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ffoulscode&width=300&height=590&colorscheme=light&show_faces=true&border_color&stream=true&header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:590px;" allowTransparency="true"></iframe>
<div id="facebook_link"><span style="font-size: x-small;"><a href="http://foulscode.blogspot.gr/2013/01/floating-facebook-like-box-for-blogger-2.html" target="_blank">Blogger</a></span></div></div></div></div>
Τώρα θα πρέπει να αλλάξετε το iframe που είναι με κόκκινα γράμματα με το δικό σας
Για να δημιουργήσετε ένα τέτοιο iframe θα πρέπει να πατήσετε [Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.]
Το iframe σας θα πρέπει να έχει τα εξής χαρακτηριστικά:
- Το URL της σελίδας σας στο Facebook ( πχ: [Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.] )
- Width : 300
- Height: 335
- Color Scheme : Light
- Show Faces :
- Border Color :
- Stream :
- Header :
Και στην συνέχεια πατάμε στο κουμπί [Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.]
10) Κάνουμε αντικατάσταση τα κόκκινα γράμματα με το καινούργιο iframe που πήραμε
11) Αποθήκευση και τέλος
[Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτόν το σύνδεσμο.]
Δημιουργήστε έναν λογαριασμό ή συνδεθείτε για να απαντήσετε
Προκειμένου να απαντήσετε πρέπει να είστε μέλος.
Δημιουργία Λογαριασμού
Ενταχθείτε στην κοινότητά μας δημιουργώντας έναν λογαριασμό. Είναι πανεύκολο!
Δημιουργία ενός νέου Λογαριασμού
Σελίδα 1 από 1
Δικαιώματα σας στην κατηγορία αυτή
Δεν μπορείτε να απαντήσετε στα Θέματα αυτής της Δ.Συζήτησης