Thông báo phát hiện AdBlock cho blogspot

   - Để ngăn chặn những quảng cáo khó chịu trên các website “thiếu tôn trọng người dùng”. Người dùng internet sử dụng các plugin AdBlock để chặn quảng cáo. AdBlock có thể là “bạn tốt” của người lướt web, nhưng đối với các Bloggers thì AdBlock lại thực sự là một “cơn ác mộng”.

   - Các ứng dụng AdBlock sẽ cũng trảm luôn cả những quảng cáo trên các website “thân thiện” (quảng cáo vừa phải, không gây khó chịu cho người dùng) làm giảm đáng kể nguồn thu nhập chính của các Bloggers vì nó ngăn chặn hiển thị quảng cáo trên wbesite của họ.

   - Và thế là các Bloggers chân chính lại phải tìm cách để sống sót với AdBlock. Họ có thể tìm cách phát hiện người lướt web đang sử dụng plugin AdBlock để thông báo (năn nỉ 😁) người dùng tắt AdBlock đi, thậm trí chặn nội dung website không cho người dùng xem cho đến khi người dùng tắt hoặc loại bỏ plug Adblock Plus .

  - Sau đây mình chia sẽ 2 đoạn code cho các bạn lựa chọn.

Cách làm đơn giản:

       + Các bạn chỉ cần vào trang quản trị Blogger -> Chỉnh sửa HTML và tìm đến thẻ </body> rồi dán 1 trong 2 đoạn code dưới đây vào trước nó và lưu lại.

Code 1:

<!--Khung thông báo phát hiện ADBLOCK-->

<style>

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

#detect-adblock{background:#0084ff;border:4px solid #0b28ff;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:15px;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;}}

</style>

<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 NTLRUBY duy trì website và tiếp tục chia sẻ các thủ thuật đến bạn.</p>

  <p>Thích NTLRUBY? Vui lòng <span class='detect-adblock-note'>tắt Adblock</span> hoặc cho NTLRUBY 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. Cảm ơn!</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>

<!--Hết Khung thông báo phát hiện ADBLOCK-->

***Lưu ý:

Trước khi lưu lại các bạn nhớ thay tên Web của mình NTLRUBY mình đã tô vàng thành tên Web của các bạn nhé!

Xem thêm >>> Tối ưu Label (Nhãn) trong Blogger

Xem thêm  >>> Cách tạo mục lục ẩn/hiện (mục lục thu gọn) cho bài viết Blogger/Blogspot

Hoặc các bạn có thể sử dụng đoạn code sau (cách làm như tương tự):

Code 2:

<!--Khung thông báo phát hiện ADBLOCK-->

<style>

#levelmaxblock{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}

#levelmaxblock .header{margin:0 0 15px 0}

#levelmaxblock .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}

#levelmaxblock button{padding:10px 20px;border:0;background:rgba(0,0,0,0.15);color:#fff;margin:20px 5px;cursor:pointer;transition:all .3s}

#levelmaxblock button:hover{background:rgba(0,0,0,0.35);color:#fff;outline:none}

#levelmaxblock button.active,#levelmaxblock button:hover.active{background:#fff;color:#222;outline:none}

#levelmaxblock .caranya{background:#fff;text-align:left;color:#000;padding:20px;height:250px;overflow:auto;line-height:30px}

#levelmaxblock .caranya div{display:none}

#levelmaxblock .caranya div.active{display:block;animation:fadeInUp .5s}

#levelmaxblock ol{margin-left:20px}

@media(max-width:680px){#levelmaxblock .inner{width:calc(100% - 80px);margin:auto}}

@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}

@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}

</style>

<script type='text/javascript'>

  //<![CDATA[

!function(){function f(){var a=document.createElement("div");a.id="levelmaxblock";a.innerHTML='<div class="inner"> <div class="header"> <h2>😔Đã Phát hiện Ad Blocker😔</h2> </div> <div class="isi"> <p>Vui lòng tắt  ADBLOCK, cảm ơn rất nhiều!😘.</p> <div class="tombol"><button class="1 active">Adblock</button><button class="2">Adblock Plus</button></div> <div class="caranya"> <div class="1 active"> <ol> <li>Click on the AdBlock icon in your browser.<br>Nhấp vào biểu tượng AdBlock trong trình duyệt của bạn.<br><img src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjygokZgLwc-v0J0GyT27-e8t4w1ohsEQiE5lA45_Dsw3kcGbFvcwksIuw2-clJMlAnPt3sqUAK4sWqn0z_X_QMLlY_AU9FoL6r_fAUVWyxcaQZXuhsLM5CCQwdxuvCeVbLposL34lfnq1l/s64/block-1.png" alt="Adblock"></li> <li>Choose, Don\'t run on pages on this domain.<br>Chọn, Không chạy trên các trang trên miền này.<br><img src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA2o7VLcQyuogg2JFeEV3gZWHM0drHEFMignDak58wBMDJiVRBKCybQoeX8J6lTUhAIWedCopiedpWUpFWgHQRBE6NnpDR84n4OEs3HDsj0qnDDPxvPhd-mpJ21pklh-ohqVgdxYffOvdt/s295/block-2.jpg" alt="Adblock" width="300px"></li> <li>The browser icon should have turned grey.<br>Biểu tượng trình duyệt phải chuyển sang màu xám.<br><img src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2rfq-oVpyn-ePQWRh9KgY7NmYorep-B2QBOCdXwXVc6kjj0fh2Xm8M9C9m3gJ8P0h05urrvjTDlfGDWsFoEf3wuP8uaHwv20jjKzON-qgadE6hfwDWEkHAdktVpSa8vY8jeimRbLGfiaN/s64/block-3.png" alt="Adblock"></li> <li>Refresh the page if it didn\'t refresh automatically. Thanks!<br>Làm mới trang nếu nó không tự động làm mới. Cảm ơn!</li> </ol> </div> <div class="2"> <ol> <li>Click on the AdBlock Plus icon in your browser.<br>Nhấp vào biểu tượng AdBlock Plus trong trình duyệt của bạn.<br><img src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivxOy0m0H9quOvR71xNpZncxlxtlB19Oe3f-2qNmWmQKrVZi24pLaDAHiz3t6f17YcSmmI9WcvrJLZwvd1ncbRxEW5mL8ihP1X_rz7ps6YvHVl5JHqtxAfmy5oK8PYRo_m_JKvRVUbzJWB/s0/block-4.png" alt="Adblock"></li> <li>Click the "This Website" button.<br>Nhấp vào nút "Trang web này".<br><img src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjsy27RPuUWeD34spFFKlygPkCjgEwgUk5FKOZ3mrYEDGy0GfuAsimymbo5BvQyMIPidwfcyfdMUI9qKBq2qRca9QUGtyDd4nIiR2TXEEKZxk0LxVil-8kHk5o33l-MDS0dBPhC0Ipc3oA/s605/off-ads-plus.jpg" alt="Adblock" width="250px"></li> <li>Click "Refresh"<br>Nhấp vào "Làm mới"<br><img src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKbIkF6xiSQ2zZgo7-qL_xk00eTWge0U9gyy_czUVMgscp7UxN1sFteDhWKjn4aH-ilFjIFlrLPX-55WzzPtOzBTtuoAaCbBfB9oNKCUbnw_k6rLSePkabqfq0Tk25BoHPv9mNMm6ffMCU/s516/off-ads-plus-1.jpg" alt="Adblock" width="250px"></li> </ol> </div> </div> </div> </div>';

document.body.append(a);document.body.style.overflow="hidden";var b=a.querySelectorAll("button");a.querySelector(".close");var d=a.querySelectorAll(".caranya > div");for(a=0;a<b.length;a++)b[a].addEventListener("click",function(a){a.preventDefault();a=this.getAttribute("class").split(" ")[0];for(var c=0;c<d.length;c++)d[c].classList.remove("active"),b[c].classList.remove("active");b[a-1].classList.add("active");d[a-1].classList.add("active")})}var b=document.createElement("script");b.type="text/javascript";

b.async=!0;b.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";b.onerror=function(){f();window.adblock=!0};var e=document.getElementsByTagName("script")[0];e.parentNode.insertBefore(b,e)}();

//]]></script>

<!--Hết Khung thông báo phát hiện ADBLOCK-->

Video:

Chúc các bạn thành công!