Hướng dẫn tạo popup quảng cáo hiện giữa màn hình cho blogspot kiểu 1
Với kiểu popup quảng cáo kiểu 1 này nó sẽ hiển thị mỗi khi bạn vào trang website, blogspot của bạn
<script src='//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'/>
Thông thường thì template blogspot nào cũng có đoạn jquery rồi. nên các bạn để ý kỹ nếu không có mý thêm vào không nó sẽ bị xung và không hoạt động.
Bước 2: thêm đoạn code dưới trên thẻ </body>
<style>
#qc-popup {display:none;background:rgba(0,0,0,0.9);width:100%;height:100%;position:fixed;top:0;left:0;z-index:99999;}
#boxclose {width:100%;height:100%;-webkit-transform:translateZ(0);}
#boxview {background:#fff;border:8px solid #fff;max-width:600px;position:absolute;top:20%;left:28%;}
#closebox {float:right;cursor:pointer;position:absolute;right:-1px;top:-2px; z-index: 99999;}
#closebox:before {font-family: FontAwesome;content:"\f00d";padding:5px 8px;background:#fff;color:#2c3e50;font-weight:normal;font-size:14px;}
#boxlink,#boxlink a.visited,#boxlink a,#boxlink a:hover {color:#aaaaaa;font-size:9px;text-decoration:none;text-align:center;padding:5px;}
#qc-box {max-width:600px;}
#qc-box img {width:100%}
</style>
<script type='text/javascript'>
//<![CDATA[
jQuery.cookie=function(key,value,options){if(arguments.length>1&&String(value)!=="[object Object]"){options=jQuery.extend({},options);if(value===null||value===undefined){options.expires=-1;}
if(typeof options.expires==='number'){var days=options.expires,t=options.expires=new Date();t.setDate(t.getDate()+days);}
value=String(value);return(document.cookie=[encodeURIComponent(key),'=',options.raw?value:encodeURIComponent(value),options.expires?'; expires='+options.expires.toUTCString():'',options.path?'; path='+options.path:'',options.domain?'; domain='+options.domain:'',options.secure?'; secure':''].join(''));}
options=value||{};var result,decode=options.raw?function(s){return s;}:decodeURIComponent;return(result=new RegExp('(?:^|; )'+encodeURIComponent(key)+'=([^;]*)').exec(document.cookie))?decode(result[1]):null;};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){if($.cookie('popup_facebook_box')!='yes'){$('#qc-popup').delay(2500).fadeIn('fast');$('#closebox, #boxclose').click(function(){$('#qc-popup').stop().fadeOut('fast');});}});
</script>
<div id='qc-popup'>
<div id='boxclose'>
</div>
<div id='boxview'>
<div id='closebox'>
</div>
<div id='qc-box'>
<a href="#LINK">
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEqBjL65yGlZoX-AFZ8uEe_zQwmVTrTrXVO7KeXQBWL3YQWOTsqlWvyhFD_RiibvUe0u1Vxzqoex5qKEUEvDUfQ1dDmk8uzVbKvhSUWZWqjj_uJ-HiPMUz6LyvDz4ier-CTjDUKvn7x3A/s1600/thiet-ke-template-blogspot-ban-hang.jpg' width='100%'/></a>
</div>
</div>
</div>
Thay đôi như sau:
- Thay #LINK thành link liên kết quảng cáo
- Link ảnh sau src thành Link ảnh bạn cần quảng cáo
- max-width:600px thành kích thước chiều rộng quảng cáo phù hợp mà bạn muốn
Xong những chương trình khuyến mãi bạn có thể xóa đi, hoặc thay ảnh để đôi các chương trình khuyến mãi khác.
Chúc các bạn thành công trong công việc và cuộc sống!
Post a Comment
Post a Comment