Cách chống chặn quảng cáo hiệu quả nhất dành cho Blogger - Insurance Finances

Ngày nay, các tiện ích Adblock ngày càng được sử dụng nhiều hơn. Hầu hết người dùng đang hướng tới trình chặn quảng cáo. Trong bài viết này mình sẽ chia sẻ cách chống chặn quảng cáo hiệu quả nhất dành cho Blogger.

Cách chống chặn quảng cáo hiệu quả nhất dành cho Blogger

Cách thực hiện

• Bước 1: Đăng nhập vào Blogger
• Bước 2: Ấn vào chủ đề ➤ Chỉnh sửa HTML
• Bước 3: Các bạn chèn đoạn css sau đây vào trước thẻ ]]></b:skin>

 #detect-adblock-zone{width:100%;z-index:99;position:fixed;bottom:0;}

#detect-adblock{background:#E23A3A;border:4px solid  #8E0707;color:#fff;text-align:center;padding:70px 20px;position:relative;bottom:-150px;opacity:0;font-size:120%;line-height:1.5em;border-radius:5px;width:100%;max-width:1056px;height:auto;z-index:99;box-shadow:0 5px 15px rgba(0,0,0,0.5);margin:0 auto; top: -300px;}

#detect-adblock p{margin:0}

#detect-adblock.show{pointer-events:auto;opacity:1;bottom:0;}

.detect-adblock-note{text-decoration:underline;}

.detect-adblock-title{text-decoration:underline;font-weight:700;font-size:24px;animation-name:blinker;animation-duration:3s;animation-timing-function:linear;animation-iteration-count:infinite;}

.close-detect-adblock:hover{color:#1C90F3;box-shadow:0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);transform:scale(1,1);}

#detect-adblock.show{animation:detect-adblock-anim ease-out 1s;animation-iteration-count:1;transform-origin:50% 50%;-webkit-animation:detect-adblock-anim ease-out 1s;-webkit-animation-iteration-count:1;-webkit-transform-origin:50% 50%;-moz-animation:detect-adblock-anim ease-out 1s;-moz-animation-iteration-count:1;-moz-transform-origin:50% 50%;-o-animation:detect-adblock-anim ease-out 1s;-o-animation-iteration-count:1;-o-transform-origin:50% 50%;-ms-animation:detect-adblock-anim ease-out 1s;-ms-animation-iteration-count:1;-ms-transform-origin:50% 50%}

.close-detect-adblock{background:#fff;color:#E23A3A;text-align:center;position:absolute;top:-15px;right:5%;font-size:24px;cursor:pointer;width:30px;height:30px;line-height:30px;border-radius:100%;transition:all 0.3s cubic-bezier(.25,.8,.25,1);box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24)}

@keyframes detect-adblock-anim{0%{opacity:0.3;transform:translate(0px,80px)}100%{opacity:1;transform:translate(0px,0px)}}

@keyframes blinker{0%{opacity:1.0;}50%{opacity:0.0;}100%{opacity:1.0;}}

@media only screen and (max-width:640px){

#detect-adblock-zone,#detect-adblock,.close-detect-adblock{display:none;}}

• Bước 4: Tìm đến thẻ </body>, copy đoạn mã dưới đây vào trước thẻ đó.

<div id='detect-adblock-zone'><div id='detect-adblock'>

  <p><i class='fa fa-frown-o'/> <span class='detect-adblock-title'>Oh-No!! CÓ VẺ NHƯ BẠN ĐANG BẬT ADBLOCK</span> <i class='fa fa-frown-o'/></p>

  <p>Quảng cáo giúp ReLub.Net duy trì website và tiếp tục chia sẻ các thông tin hữu ích đến bạn.</p>

  <p>Bạn có thích ReLub.Net? Vui lòng <span class='detect-adblock-note'>tắt Adblock</span> hoặc cho ReLub.Net vào <span class='detect-adblock-note'>danh sách trắng</span> trong công cụ chặn quảng cáo của bạn. Xin cảm ơn bạn rất nhiều!</p>

<div class='close-detect-adblock' onclick='hidedetect()'>&#215;</div>

</div></div>

<script type='text/javascript'>

//<![CDATA[

setTimeout(function() {

  var info = document.getElementById("detect-adblock");

  var ads = document.querySelectorAll("ins.adsbygoogle");

  if ($(ads).height() === 0 ) {

    info.className = "show";

  }

}, 5000)

function hidedetect() {

  var e = document.getElementById("detect-adblock").style.display = "none";

};

//]]>

</script>

Bạn hãy thay đổi các dòng thông báo, đặc biệt là tên Blog của các bạn.

• Bước 4: Các bạn lưu chủ đề và xem thành quả nha.

Lời kết

Mình biết rằng quảng cáo rất khó chịu nhưng quảng cáo là cách để các Blogger duy trì Website của họ. Bài viết trên mình đã chia sẻ cách đơn giản để chống chặn quảng cáo hiệu quả nhất dành cho Blogger. Hy vọng hữu ích cho các bạn.

Related Posts