Popup Quảng cáo giữa màn hình cho website, blogspot kiểu 1

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

popup quang cao giua trang website cho blogspot



- Bước 1: Để ý website của bạn xem có đoạn jquery nào chưa nếu chưa thêm đoạn sau jquery sau vào trên thẻ </head> trong template blogspot cần hiên quảng cáo.
<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(&#39;popup_facebook_box&#39;)!=&#39;yes&#39;){$(&#39;#qc-popup&#39;).delay(2500).fadeIn(&#39;fast&#39;);$(&#39;#closebox, #boxclose&#39;).click(function(){$(&#39;#qc-popup&#39;).stop().fadeOut(&#39;fast&#39;);});}});
</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://lh4.googleusercontent.com/-2aKmhvPDklA/VpcDPUrszFI/AAAAAAAAAfY/c-I1HJPw7Zc/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!

6 nhận xét trong bài "Popup Quảng cáo giữa màn hình cho website, blogspot kiểu 1"

  1. mình làm theo mà mỗi lần mình vào 1 mục nào của web nó lại hiện ra bạn ạ

    ReplyDelete
    Replies
    1. This comment has been removed by the author.

      Delete
    2. Nếu bạn muốn chỉ hiểu thị ở trang chủ thì bạn áp dụng các cặp thẻ điều kiện ở bài viết sau: http://www.sharetemplateseo.com/2016/07/thiet-ke-blogspot-voi-cac-cap-dieu-kien.html Thân!

      Delete