Tổng hợp Code popup cho blogspot
Tổng hợp các Code Popup Javascripts quảng cáo cho website Ưu điểm cái này mình thích là dùng jquery nên có vẻ mượt mà và load nhẹ hơn tốt cho seoCode popup cho blogspot - Code popup cho blogspot
Chú ý: code popup chỉ hiện 1 lần duy nhất thôi nhé nên không gây phiền hà cho người dùng, cái này có thể thêm được like cho trang của bạn hoặc một quảng cáo cho chương trình quảng cáo rất hay
Có thể bạn cần xem bài này
code blogspot hiện lable widget trong blogspot theo ý mình
Hôm nay SEO Khương Blogspot mình sẽ giới thiệu cho các bạn CÁCH LÀM POPUP CHO BLOGSPOT
B1 : thêm thư viện jquery vào giữa cặp thẻ HEAD
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.js'></script>
<script src="http://yourjavascript.com/11215013191/jquery.colorbox-min.js"></script>
B2: thêm style css.
<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{}
#cboxLoadingOverlay{background:url(http://3.bp.blogspot.com/-7VRvnW_MUSw/TwRGXjXjloI/AAAAAAAACM0/5K-J5jgkxo4/s1600/%255Bwww.gj37765.blogspot.com%255Dloadingbackground.png) no-repeat center center;}
#cboxLoadingGraphic{background:url(http://3.bp.blogspot.com/-xjj51r2lm2M/TwRGaKezqHI/AAAAAAAACNI/lKX9_-YUUdY/s1600/%255Bwww.gj37765.blogspot.com%255Dloading.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://3.bp.blogspot.com/-UFvsMA0xw_s/TwRGZN6BBGI/AAAAAAAACNA/_z47WNmUOfs/s1600/%255Bwww.gj37765.blogspot.com%255Dcontrols.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;}
#mdfb {
font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;
}
#mdfb a,
#mdfb a:hover,
#mdfb 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;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
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>
B3: Thêm java script
<script type="text/javascript">
$(function() {
if (document.cookie.indexOf('visited=flase') == -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:"400px", inline:true, href:"#mdfb"});
}
}); </script>
B4 Thêm nội dung khi hiển thị bật lên
<div style='display:none'>
<div id='mdfb' style='padding:10px; background:#fff;'>
<center>
helo nhúng gì đó vào đây
</center>
</div></div>
<style>#cboxClose{display:none;}</style>
Chỉ có thế thôi. các bạn thắc mắc để lại comment nhé
Biểu tượng cảm xúcBiểu tượng cảm xúc