GADGETS FOR BLOGS

Facebook Google plus YouTube Pinterest Tumblr Delicius DIIGO Start.me NETVIBES feedburner

ΠΩΣ ΒΑΖΩ FACEBOOK POP UP LIKE BOX

FACEBOOK POPUP
ΠΩΣ ΒΑΖΩ FACEBOOK POP UP LIKE BOX ΣΤΟ BLOGGER
Το pop up facebook like box εμφανίζεται με το που μπαίνει κάποιος επισκέπτης στη σελίδα σας σαν ένα αναδυόμενο παράθυρο (pop up) το οποίο παροτρύνει τον επισκέπτη σας να κάνει like στη σελίδα σας στο facebook. Το χρησιμοποιούν πολλές ιστοσελίδες για να κερδίσουν περισσότερα like στη σελίδα τους στο facebook.
Αυτό το pop up like box εμφανίζεται μόνο την πρώτη φορά που θα επισκεφθεί κάποιος το blog σας γιατί εγκαθιστά αυτόματα cookies στον υπολογιστή του επισκέπτη, ώστε αν σας επισκεφθεί και δεύτερη φορά να μην ξαναεμφανιστεί το pop up like box και καθυστερεί την περιήγηση των επισκεπτών σας με αποτέλεσμα να εκνευρίζονται και να σκέφτονται να σας ξαναεπισκεφθούν.

Για να το προσθέσετε στο blog σας ακολουθήστε τα εξής απλά βήματα.

1. σύνδεση στο blogger.com
2. Διάταξη > Προσθήκη gadget > HTML/JavaScript
3. Eπικολλήστε τον παρακάτω κώδικα :

<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;}
#cboxTopLeft{width:14px;height:14px;background:url(http://1.bp.blogspot.com/-t5nd9AtEcL8/T3WbsokUXAI/AAAAAAAACDg/bvza-PbD5ho/s1600/controls.png) no-repeat 0 0;}
#cboxTopCenter{height:14px;background:url(http://3.bp.blogspot.com/-CuV9SmF3JaE/T3WcIeBX1GI/AAAAAAAACDo/6mDsw0AuGS4/s1600/border.png) repeat-x top left;}
#cboxTopRight{width:14px;height:14px;background:url(http://1.bp.blogspot.com/-t5nd9AtEcL8/T3WbsokUXAI/AAAAAAAACDg/bvza-PbD5ho/s1600/controls.png) no-repeat -36px 0;}
#cboxBottomLeft{width:14px;height:43px;background:url(http://1.bp.blogspot.com/-t5nd9AtEcL8/T3WbsokUXAI/AAAAAAAACDg/bvza-PbD5ho/s1600/controls.png) no-repeat 0 -32px;}
#cboxBottomCenter{height:43px;background:url(http://3.bp.blogspot.com/-CuV9SmF3JaE/T3WcIeBX1GI/AAAAAAAACDo/6mDsw0AuGS4/s1600/border.png) repeat-x bottom left;}
#cboxBottomRight{width:14px;height:43px;background:url(http://1.bp.blogspot.com/-t5nd9AtEcL8/T3WbsokUXAI/AAAAAAAACDg/bvza-PbD5ho/s1600/controls.png) no-repeat -36px -32px;}
#cboxMiddleLeft{width:14px;background:url(http://1.bp.blogspot.com/-t5nd9AtEcL8/T3WbsokUXAI/AAAAAAAACDg/bvza-PbD5ho/s1600/controls.png) repeat-y -175px 0;}
#cboxMiddleRight{width:14px;background:url(http://1.bp.blogspot.com/-t5nd9AtEcL8/T3WbsokUXAI/AAAAAAAACDg/bvza-PbD5ho/s1600/controls.png) repeat-y -211px 0;}
#cboxContent{background:#fff;overflow:visible;}
#cboxLoadedContent{margin-bottom:5px;}
#cboxLoadingOverlay{background:url(http://4.bp.blogspot.com/-4Qn7M-IPt4c/T3WdJemHwnI/AAAAAAAACDw/9fXsGPXJ1ig/s1600/loadingbackground.png) no-repeat center center;}
#cboxLoadingGraphic{background:url(http://1.bp.blogspot.com/-V757h43tLZU/T3WdmKS5Q5I/AAAAAAAACD4/25oYbn0MMfU/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(http://1.bp.blogspot.com/-t5nd9AtEcL8/T3WbsokUXAI/AAAAAAAACDg/bvza-PbD5ho/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:6px;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>
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="http://2.bp.blogspot.com/-5yMUILmjjyc/T3WeEqzdfHI/AAAAAAAACEA/XJDxnKh6W48/s1600/background+image.png" border="0" height="300" style="width: 505px;"><tbody><tr><td height="345" width="505"><div align="right">
<iframe src="http://www.facebook.com/plugins/likebox.php?href= https://www.facebook.com/widgetsforblogs&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>
</div></div>

Το μόνο που έχετε να κάνετε είναι να αλλάξετε τον σύνδεσμο της facebook σελίδας που έχω με πράσινο χρώμα με την διεύθυνση της δικής σας σελίδας στο facebook και είστε έτοιμοι !