Как добавить блокировщик всплывающих окон на Blogger в 2023 году

Чтобы заблокировать неуважительную рекламу на веб-сайтах, люди часто используют плагин Adblock в Wordpress , но как насчет Blogger ? Это была катастрофа. Это может повлиять на доходы многих из нас, блоггеров, потому что блокирует показ рекламы в блогах блоггеров или на веб-сайтах.

Но ничего страшного, если вы наткнулись на этот пост, вам повезло. Я расскажу вам, как добавить блокировщик всплывающих окон в Blogger 2023. В этом руководстве я расскажу вам, как добавить блокировщик всплывающих окон всценарий Blogger 2023, чтобы помочь владельцам веб-сайтов блоггеров не терять доход из-за блокировщика рекламы. 

Далее просто добавьте ниже показанные стили в шаблон Blogger и всё заработает.

1. Добавьте этот код выше кода ]]></b:skin>

/* Pop-Up Box (Style 2) */

.popSc{position:fixed;top:0;bottom:0;left:0;right:0;padding:20px;background:rgba(255, 255, 255, 0.1);z-index:99999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;justify-content:center;align-items:center}

.popSc.hidden{display:none}

.popSc .popBo{position:relative;background:rgba(255, 255, 255, 0.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-width:400px;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:30px;border-radius:20px;box-shadow:0 5px 25px rgb(0 0 0 / 20%)}

.popSc .popBo svg{display:block;width:50px;height:50px;fill:none !important;stroke:#08102b;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}

.popSc .popBo h2{margin:10px 0 15px 0;font-size:1.2rem;font-weight:800;color:#08102b}

.popSc .popBo p{margin:0;line-height:1.7em;font-size:0.9rem;color:#08102b}

.popSc{animation:popupBlur .3s ease-in; -webkit-animation:popupBlur .3s}

.popSc >*{animation:popupScale .3s ease-in; -webkit-animation:popupScale .3s}

.drK .popSc{background:rgba(0, 0, 0, 0.1)}

.drK .popSc .popBo{background:rgba(50, 50, 50, 0.8)}

.drK .popSc .popBo svg{stroke:#fefefe}

.drK .popSc .popBo p, .drK .popSc .popBo h2{color:#fefefe}

@keyframes popupBlur {from{opacity:0}to{opacity:1}}

@-webkit-keyframes popupBlur{from{opacity:0}to{opacity:1}}

@keyframes popupScale{from{transform:scale(0);animation-timing-function:ease-in;opacity:0}to{transform:scale(1);opacity:1}}

@-webkit-keyframes popupScale{from{-webkit-transform:scale(0);-webkit-animation-timing-function: ease-in;opacity:0}to{-webkit-transform:scale(1);opacity:1}}{codeBox}

2. Добавьте javascript выше тега </body>

<script>/*<![CDATA[*/ /* Anti Ad-Blocker Script by Fineshop (Lazyload) */ var lazyAnti=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===lazyAnti||0!=document.body.scrollTop&&!1===lazyAnti)&&(!function(){var antiAdBlock=document.querySelector("#antiAdBlock");var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";e.onerror=function(){if(antiAdBlock!=null){antiAdBlock.classList.remove("hidden");window.lazyAnti=!0}};var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyAnti=!0)},!0); /*]]>*/</script> {codeBox}

3. И последнее, добавьте разметку HTML стиля выше кода javascript

<div class='popSc hidden' id='antiAdBlock'>

<div class='popBo'>

<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><circle cx='12' cy='12' r='10'/><line x1='12' x2='12' y1='8' y2='12'/><line x1='12' x2='12.01' y1='16' y2='16'/></svg>

<h2>Обнаружен блокировщик рекламы!</h2>

<p> К сожалению, мы обнаружили, что вы активировали блокировщик рекламы. Пожалуйста, поддержите нас, отключив блокировщик рекламы, это поможет нам в разработке этого веб-сайта. Спасибо!

</p>

</div>

</div>{codeBox}

На этом всё !!!. Можете сами проверить работу скрипта при включёном блокировщике рекламы.