Como instalar Anti Adblock no Blogger
Como instalar Anti Adblock no Blogger |
Como instalar Anti Adblock no Blogger
Para nós blogueiros que monetizamos nossos blogs com programas de afiliados ou publicidades sofremos muitos com alguns leitores que utilizam os bloqueadores de publicidades. Hoje iremos mostrar como instalar Anti Adblock no Blogger.
O que é o adblock?
O Adblock é uma extensão usada pelos navegadores para oculta as propagandas e anúncios dos blogs.
Aprenda instalar Anti Adblock no Blogger
Vá até Modelo; Editar HTML do seu blog, clique sobre o editor de código e tecle CTRL+F e procure por ]]></b:skin> e acima deste cole esse codigo:
/* Notificação AdBlock verefazer.com */
#keep-ads{padding:0;position:fixed;bottom:0;opacity:0;height:auto;transition:all .6s cubic-bezier(.25,.8,.25,1);-webkit-transform:translateZ(0);transform:translateZ(0);backface-visibility:hidden;transition:all .2s ease-in-out,visibility 0s;transform-origin:bottom center;}
.keep-adsme{background:#e74c3c;color:#fff;position:absolute;text-align:center;padding:0 30px 30px 30px;margin:auto;top:30%;left:0;right:0;font-size:1.5rem;line-height:1.5;font-family:monospace;max-width:930px;box-shadow:0 20px 10px -10px rgba(0,0,0,0.15);transition:all .6s cubic-bezier(.25,.8,.25,1);border:15px solid rgba(0,0,0,.07);overflow:hidden;}
.keep-adsme:hover{box-shadow:0 20px 10px -10px rgba(0,0,0,0.2);}
.keep-adsme h4{display:inline-block;background:rgba(0,0,0,.07);padding:5px 25px 15px 25px;font-size:2.2rem;margin:0 auto}
#keep-ads p{margin:0}
#keep-ads a{color:#ffe88b;}#keep-ads a:hover{color:#ffe88b;text-decoration:underline}
#keep-ads.show{left:0;top:0;right:0;z-index:1000;pointer-events:auto;opacity:1;visibility:visible;transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);animation:wobble .7s;opacity:1;}
.close-keep-ads{visibility:hidden;opacity:0;color:#ffe88b;text-align:center;position:absolute;bottom:10px;right:10px;font-size:42px;cursor:pointer;width:30px;height:30px;line-height:30px;border-radius:100%;transition:all .6s cubic-bezier(.25,.8,.25,1);transform:translate(0,50px);}
.close-keep-ads:hover{color:#fff;transform:scale(1.0);}
.keep-adsme:hover .close-keep-ads{visibility:visible;opacity:1;color:#ffe88b;transform:translate(0,0);}
#keep-ads p span {font-family:fontawesome;font-size:5rem;}
@keyframes wobble{0%{transform:scale(0) rotate(-54deg) translatey(40px)}45%{transform:scale(1.1) rotate(20deg) translatey(0px)}60%{transform:scale(1) rotate(-15deg) translatey(0px)}77%{transform:scale(1) rotate(10deg) translatey(0px)}100%{transform:translatey(0)}}
Agora procure por </body> e acima deste cole o código a seguir:
<div id='keep-ads'>
<div class='keep-adsme'>
<p><h4>Adblock Detectado</h4></p>
<p><span><i aria-hidden='true' class='fa fa-exclamation-triangle'/></span></p>
<p>PRIMEIRA LINHA DA MENSAGEM ESCREVA AQUI</p>
<p>SEGUNDA LINHA DA MENSAGEM ESCREVA AQUI</p>
<p>Muito obrigado, NOME SEU BLOG</p>
<div class='close-keep-ads' onclick='hidekeep()'>×</div>
</div>
</div>
<script type='text/javascript'>
//<![CDATA[
// Notificação AdBlock verefazer.org
function hidekeep(){document.getElementById("keep-ads").style.display="none"}setTimeout(function(){var e=document.getElementById("keep-ads"),t=document.querySelectorAll("ins.adsbygoogle");0===$(t).height()&&(e.className="show")},2e3);
//]]>
</script>
Agora altere onde está de vermelho por uma mensagem que pede ao visitante para desativar o adblock para continuar navegando em seu blog, e em seguida clique em salvar modelo.