Code chặn người dùng cài Adblock chặn quảng cáo cho blog/web

Bạn có một trang blog chia sẻ thủ thuật, chia sẻ game hay, chia sẻ phần mềm hữu ích và có chạy quảng cáo của Adsense để kiếm thêm thu nhập.

Tất cả những gì bạn chia sẻ đều là miễn phí. Tuy rằng bạn cũng cần traffic tức lưu lượng truy cập nhưng bạn cũng cần có thu nhập từ quảng cáo nhưng khách truy cập sử dụng trình duyệt có cài tiện ích mở rộng Adblock để chặn quảng cáo và dùng chùa blog của bạn thì quả là không mấy công bằng. Nếu thực sự không cần khách truy cập dạng này thì bạn có thể cài code chặn người dùng sử dụng Adblock chặn quảng cáo. Tuy nhiên việc gì đều có mặt lợi và hại nên cần suy nghĩ kỹ trước khi sử dụng.

Code chặn người dùng cài Adblock

Để cài đặt code chặn người dùng sử dụng trình duyệt cài Adblock chặn quảng cáo cho blogspot/blogger bạn cần vào chỉnh sửa mẫu thêm CSS và Javascript. Bài viết này chia sẻ 3 kiểu xuất hiện thông báo với 3 code css tương ứng. Phần javascript là dùng chung cho cả 3 mẫu css.

3 mẫu CSS có thể sử dụng.

Mẫu 1

/* Animation Adblock */
@keyframes fadeInDown{from{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}
/* Adblock */
#arlinablock{background:rgba(20,20,20,0.50);position:fixed;margin:auto;left:0;right:0;top:0;bottom:0;overflow:auto;z-index:999999;animation:fadeInDown 1s}
#arlinablock .header{margin:0 0 15px 0}
#arlinablock .inner{background:#fff;color:#222;box-shadow:0 0 2rem -1rem rgba(0,0,0,0.5);text-align:center;width:100%;max-width:640px;padding:30px;margin:7% auto 2% auto;animation:fadeInDown 1s}
#arlinablock button{padding:10px 20px;border:0;background:#fff;color:#e74c3c;margin:20px 5px;cursor:pointer;border-radius:3px;font-size:13px;font-weight:600;border:2px solid #e74c3c;transition:initial}
#arlinablock button:hover{background:#2c3e50;color:#fff;outline:none;border-color:#2c3e50}
#arlinablock button.active,#arlinablock button:hover.active{background:#e74c3c;color:#fff;border-color:#e74c3c;outline:none}
#arlinablock .fixblock{background:#fff;text-align:left;color:#000;padding:20px;height:250px;overflow:auto;line-height:30px}
#arlinablock .fixblock div{display:none}
#arlinablock .fixblock div.active{display:block}
#arlinablock ol{margin-left:20px}
@media(max-width:768px){#arlinablock .inner{width:calc(100% - 20px);margin:10px auto;padding:15px}}

Mẫu 2

/* Animation Adblock */
@keyframes fadeInDown{from{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}
/* Adblock */
#arlinablock{background:rgba(20,20,20,0.70);position:fixed;margin:auto;left:0;right:0;top:0;bottom:0;overflow:auto;z-index:999999;animation:fadeInDown 1s}
#arlinablock .header{margin:0 0 15px 0}
#arlinablock .inner{background:#e3482d;color:#fff;box-shadow:0 5px 20px rgba(0,0,0,0.1);text-align:center;width:100%;max-width:640px;padding:30px;margin:7% auto 2% auto;animation:fadeInDown 1s}
#arlinablock button{padding:10px 20px;border:0;background:rgba(0,0,0,0.15);color:#fff;margin:20px 5px;cursor:pointer;transition:all .3s}
#arlinablock button:hover{background:rgba(0,0,0,0.35);color:#fff;outline:none}
#arlinablock button.active,#arlinablock button:hover.active{background:#fff;color:#222;outline:none}
#arlinablock .fixblock{background:#fff;text-align:left;color:#000;padding:20px;height:250px;overflow:auto;line-height:30px}
#arlinablock .fixblock div{display:none}
#arlinablock .fixblock div.active{display:block}
#arlinablock ol{margin-left:20px}
@media(max-width:768px){#arlinablock .inner{width:calc(100% - 20px);margin:10px auto;padding:15px}}

Mẫu 3

/* Animation Adblock */
@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}100%{opacity:1;transform:translateY(0)}}
@keyframes rubberBand{from{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,0.75,1)}40%{transform:scale3d(0.75,1.25,1)}50%{transform:scale3d(1.15,0.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}to{transform:scale3d(1,1,1)}}
/* Adblock */
#arlinablock{background:rgba(0,0,0,0.65);position:fixed;margin:auto;left:0;right:0;top:0;bottom:0;overflow:auto;z-index:999999;animation:fadeInDown 1s}
#arlinablock .header{margin:0 0 15px 0}
#arlinablock .inner{background:#e3482d;color:#fff;box-shadow:0 5px 20px rgba(0,0,0,0.1);text-align:center;width:600px;padding:40px;border-radius:5px;margin:7% auto 2% auto;animation:rubberBand 1s}
#arlinablock button{padding:10px 20px;border:0;background:rgba(0,0,0,0.15);color:#fff;margin:20px 5px;cursor:pointer;transition:all .3s}
#arlinablock button:hover{background:rgba(0,0,0,0.35);color:#fff;outline:none}
#arlinablock button.active,#arlinablock button:hover.active{background:#fff;color:#222;outline:none}
#arlinablock .fixblock{background:#fff;text-align:left;color:#000;padding:20px;height:250px;overflow:auto;line-height:30px}
#arlinablock .fixblock div{display:none}
#arlinablock .fixblock div.active{display:block}
#arlinablock ol{margin-left:20px}
@media(max-width:768px){#arlinablock .inner{width:calc(100% - 20px);margin:10px auto;padding:15px}}

Javascript

Phần link javascript này đã được đặt trong mã javascript. Chỉ tải khi cuộn trang để không làm chậm tốc độ load trang. Bạn dán trước thẻ </body> và nên tải về up lên host riêng tránh dùng chung.

<script>/*<![CDATA[*/  
     // Say Hi to Adblock
      window.addEventListener("load",function(){function a(){if(0==b){b=1;var a=document.createElement("script");a.async=!0,a.src="https://raw.githack.com/dtbvoz/nz/main/tbadblock.js";var c=document.getElementsByTagName("script")[0];c.parentNode.insertBefore(a,c)}}var b=0;window.addEventListener("scroll",function(){a()})});
      /*]]>*/</script>

Cảm ơn các bạn đã đọc bài viết.

=> Tăng tương tác MXH giá rẻ, uy tín tại: SubLikeNgon.Com

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Chào mừng bạn đến với Shop Theme Wordpress. Chúc bạn có khoảng thời gian ý nghĩa khi mua sắm tại đây! Bỏ qua