jQuery Facebook Popup Like Box v3. Η νέα τάση συνεχίζει και εξελίσεται

Μετά από την επιτυχημένη εκδοχή jQuery Facebook Popup Like Box v2 έρχεται η τρίτη εκδοχή για να αλλάξει τα δεδομένα. Όσοι πρωτομπαίνετε στη Σελίδα μου θα δείτε την καινούργια εκδοχή. Όσοι δεν το βλέπετε αρκεί να καθαρίσετε από τον browser το ιστορικό περιήγησης και να επισκεφτείτε τη Σελίδα μου. Σαν εικόνα θα φαίνεται όπως παρακάτω.

Σε άλλες σελίδες θα το βρείτε, αλλά δεν έχουν προνοήσει να το κάνουν να εμφανίζεται μόνο μια φορά, αλλά σε κάθε αλλαγή εμφανίζεται και πάλι, οπότε... τον χάσαμε τον επισκέπτη.
Ας δούμε τα βήματα για να το εγκαταστήσουμε.

Σύνδεση στον Blogger
Διάταξη / Προσθήκη gadget
Επιλέξτε HTML/JavaScript
Επικολλήστε τον παρακάτω κώδικα:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script> 
<script src="http://yourjavascript.com/3093182329/btt_jquery.colorbox-min.js"></script> 
<style>#colorbox, #cboxOverlay, #cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;}#cboxOverlay{position:fixed;width:100%;height:100%;}#cboxMiddleLeft, #cboxBottomLeft{clear:left;}#cboxContent{position:relative;}#cboxLoadedContent{overflow:auto;}#cboxTitle{margin:0;}#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;}#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}.cboxPhoto{float:left;margin:auto;border:0;display:block;}.cboxIframe{width:100%;height:100%;display:block;border:0;}#cboxOverlay{background:#000;opacity:0.5 !important;}#colorbox{/*box-shadow*/-webkit-box-shadow:0 0 15px rgba(0,0,0,0.4);-moz-box-shadow:0 0 15px rgba(0,0,0,0.4);box-shadow:0 0 15px rgba(0,0,0,0.4);}#cboxTopLeft{width:14px;height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdkLzC4INYnSCuvmUMs5po85oWqTIq0q65m9k-bqvr7vi6NLeugrQAjJb8TG8c_L4K3NDbEvpvC6XlVB0T5F3qXdRDvRqgqARHEoTLpXRrhValDaE6zSkxRsW35-nnjj9sP7g8MtFDvFP8/s1600/controls.png) no-repeat 0 0;}#cboxTopCenter{height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZmRe75q0TD_WCjgSP1Pk9bA_maIcM5Pg_kUhw_J7Jn1_JS08uHKcKKvKwXjcUGEbJCZbpE8e6PxoXY0S7NKdfrKXU6kGU0ChIwFl8GwWl5GcrnjnxnhTJxBkhyAxKeXfFBlslmSQg2qmJ/s1600/border.png) repeat-x top left;}#cboxTopRight{width:14px;height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdkLzC4INYnSCuvmUMs5po85oWqTIq0q65m9k-bqvr7vi6NLeugrQAjJb8TG8c_L4K3NDbEvpvC6XlVB0T5F3qXdRDvRqgqARHEoTLpXRrhValDaE6zSkxRsW35-nnjj9sP7g8MtFDvFP8/s1600/controls.png) no-repeat -36px 0;}#cboxBottomLeft{width:14px;height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdkLzC4INYnSCuvmUMs5po85oWqTIq0q65m9k-bqvr7vi6NLeugrQAjJb8TG8c_L4K3NDbEvpvC6XlVB0T5F3qXdRDvRqgqARHEoTLpXRrhValDaE6zSkxRsW35-nnjj9sP7g8MtFDvFP8/s1600/controls.png) no-repeat 0 -32px;}#cboxBottomCenter{height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZmRe75q0TD_WCjgSP1Pk9bA_maIcM5Pg_kUhw_J7Jn1_JS08uHKcKKvKwXjcUGEbJCZbpE8e6PxoXY0S7NKdfrKXU6kGU0ChIwFl8GwWl5GcrnjnxnhTJxBkhyAxKeXfFBlslmSQg2qmJ/s1600/border.png) repeat-x bottom left;}#cboxBottomRight{width:14px;height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdkLzC4INYnSCuvmUMs5po85oWqTIq0q65m9k-bqvr7vi6NLeugrQAjJb8TG8c_L4K3NDbEvpvC6XlVB0T5F3qXdRDvRqgqARHEoTLpXRrhValDaE6zSkxRsW35-nnjj9sP7g8MtFDvFP8/s1600/controls.png) no-repeat -36px -32px;}#cboxMiddleLeft{width:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdkLzC4INYnSCuvmUMs5po85oWqTIq0q65m9k-bqvr7vi6NLeugrQAjJb8TG8c_L4K3NDbEvpvC6XlVB0T5F3qXdRDvRqgqARHEoTLpXRrhValDaE6zSkxRsW35-nnjj9sP7g8MtFDvFP8/s1600/controls.png) repeat-y -175px 0;}#cboxMiddleRight{width:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdkLzC4INYnSCuvmUMs5po85oWqTIq0q65m9k-bqvr7vi6NLeugrQAjJb8TG8c_L4K3NDbEvpvC6XlVB0T5F3qXdRDvRqgqARHEoTLpXRrhValDaE6zSkxRsW35-nnjj9sP7g8MtFDvFP8/s1600/controls.png) repeat-y -211px 0;}#cboxContent{background:#fff;overflow:visible;}#cboxLoadedContent{margin-bottom:5px;}#cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj40PCpFhU5_ceJyyKU6dxeqD_otSSiypGWE_ZVTfvlJqb5TpVc_Wtxta6MQGyRXYBEoB8gmVCye-x5WiX8YVfPdBcKf5bLETiwadJJ32tY59h6SNrXgdu5ZwZKGSqIT15dIXlkLK92EpCN/s1600/loadingbackground.png) no-repeat center center;}#cboxLoadingGraphic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3o4vPx-FH-cK6aTuG-JkNxcWTXpKh5muB3ulmc2P5tSD3sAf6_ZzD5bAYUt_v7p2rAq9YF4WAeNL34RmeXl0SmqZZarOAAbjQQR-PVdj_MoT3DiwjQe7pZR0FQTV5wFgKzPDLzVtwcHyz/s1600/loading.gif) no-repeat center center;}#cboxTitle{position:absolute;bottom:-25px;left:0;text-align:center;width:100%;font-weight:bold;color:#7C7C7C;}#cboxCurrent{position:absolute;bottom:-25px;left:58px;font-weight:bold;color:#7C7C7C;}#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute;bottom:-29px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdkLzC4INYnSCuvmUMs5po85oWqTIq0q65m9k-bqvr7vi6NLeugrQAjJb8TG8c_L4K3NDbEvpvC6XlVB0T5F3qXdRDvRqgqARHEoTLpXRrhValDaE6zSkxRsW35-nnjj9sP7g8MtFDvFP8/s1600/controls.png) no-repeat 0px 0px;width:23px;height:23px;text-indent:-9999px;}#cboxPrevious{left:0px;background-position:-51px -25px;}#cboxPrevious.hover{background-position:-51px 0px;}#cboxNext{left:27px;background-position:-75px -25px;}#cboxNext.hover{background-position:-75px 0px;}#cboxClose{right:0;background-position:-100px -25px;}#cboxClose.hover{background-position:-100px 0px;}.cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px;right:27px;}.cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}.cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px;right:27px;}.cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}#btt{font:12px/1.2 Arial,Helvetica,san-serif;color:#666;}#btt a,    #btt a:hover,    #btt a:visited{text-decoration:none;}.mdbox-title{background:#000;color:#fff;font-size:20px !important;font-weight:bold;margin:10px 0;border:20px solid #ddd;/*border-radius*/-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;/*box-shadow*/-webkit-box-shadow:5px 5px 5px #CCCCCC;-moz-box-shadow:5px 5px 5px #CCCCCC;box-shadow:5px 5px 5px #CCCCCC;padding:10px;line-height:25px;font-family:arial !important;}.mdbox-tagline{color:#999;margin:0;text-align:center;}#mdsubs-container{padding:35px 0 30px 0;position:relative;}a:link, a:visited{border:none;}.demo{display:none;}</style><script src="http://yourjavascript.com/3093182329/btt_jquery.colorbox-min.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function(){ 
   if (document.cookie.indexOf('visited=true') == -1) { 
       var fifteenDays = 1000*60*60*24*30; 
       var expires = new Date((new Date()).valueOf() + fifteenDays); 
       document.cookie = "visited=true;expires=" + expires.toUTCString(); 
   $.colorbox({width:"600px", inline:true, href:"#btt"}); 
       } 
}); 
</script> <div style='display:none'><div id='btt' style='padding:10px; background:#fff;'><center><table align="center"background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjux5ddWvWAKYib07efMtXLit6PwGgbRK8AIO3efr53NFVz7T1WobA_wE-OIFmKGIAPEFUrbj0m5DcJPHUmB9Ja4PTIjjINTa3kvQ9r6fJz9ehO39oVuUDZ5pSG0HavyTpEAfd4NwegPrmT/s1600/background+image.png" border="0" height="300" style="width: 505px;"><tbody><tr><td height="345" width="505"><div align="right">

<iframe src="//www.facebook.com/plugins/likebox.php?href=ΤΟ LINK ΤΗΣ ΣΕΛΙΔΑΣ ΣΑΣ ΣΤΟ FACEBOOK&amp;width=330&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=255" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:330px; height:255px;" allowtransparency="true"></iframe></div></td></tr></tbody></table></center><p style=" float:right;  margin-right:35px;  font-size:6px;" >Powered By <a style=" font-size:6px; color:#3B78CD; text-decoration:none;" href="http://www.bloggertipsandtricks.net/2012/03/jquery-facebook-popup-like-box-v2.html" target='_blank'>Blogger Tips and Tricks</a></p></div></div>

Αντικαταστήστε ΤΟ LINK ΤΗΣ ΣΕΛΙΔΑΣ ΣΑΣ ΣΤΟ FACEBOOK με το δικό σας αντιγράφοντάς το από τον Browser και πατήστε αποθήκευση.

Μην ανησυχείτε αν δεν το δείτε εσείς. Όπως είπα και παραπάνω αρκεί να καθαρίσετε το ιστορικό και αν τα έχετε κάνει όλα σωστά τότε θα το δείτε.

Blogger Tips and Tricks