Como detectar AdBlock e colocar o Anti-AdBlock no seu Site e Blog
Como instalar Anti Adblock no Blogger
Se você é administrador ou editor de algum blog na internet, provavelmente já sabe colocar anúncios para ganhar dinheiro com o que você é apaixonado, porém por sua vez também deve ter percebido que há pessoas que bloqueiam esses anúncios arruinando o negócio. Portanto, você precisa saber como ativar o Anti-Adblock no seu site ou no blog do Blogger. Se você vive do que ganha em seus blogs, bloquear os anti-anúncios é fundamental para você. Porque embora todos saibamos que os anúncios podem ser chatos, o trabalho não é dado de graça e menos ainda quando você investe muito do seu tempo nele. Além disso, os anúncios do Blogger são sutis e não invasivos, portanto, não são realmente um problema.
Detectar AdBlock e exibir uma mensagem
Antes de saber como ativar o Anti-AdBlock no seu site ou Blogger, primeiro você deve conhecer suas características e como funciona, para saber quais armas temos para eliminar os bloqueadores de anúncios. Existem várias maneiras de bloquear usuários que usam o Adblock colocando um código específico dentro do blog, que fará com que uma mensagem pôster apareça bloqueando o conteúdo do site ou simplesmente colocando extensões (que são menos invasivas). Leve em consideração antes de começar, que muitas pessoas estão cansadas de ver publicidade em todos os lugares, então podem simplesmente fechar o post do blog e ir para outro.
Gerar Script Para Impedi Acesso para quem usa ADBLOCK
Colocar um código
Uma das melhores maneiras é colocar um código dentro do seu blog , para que apareça um pôster que anuncie que você deve desativar o Adblock. Existem muitas maneiras de colocar um código, pode ser através de widgets ou editando o HTML para colocar o código dentro.
Hoje, para atingir a meta de ativar o Anti-Adblock no seu site ou Blog do Blogger, você precisará colar o código no HTML do seu blog. Em primeiro lugar, é bom que você faça uma cópia de backup do seu blog antes de realizar as alterações, caso algo falhe.
Assim que terminar, vá até a opção "Tema" e depois clique em "Editar HTML". Dentro do código, clique em parte dele, aperte CTRL+F e digite no campo de procura a tag ]]></ b: skin>, e antes dela, é onde você deve copiar e colar o código abaixo:
#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)}}
O código anterior serve para dar um estilo específico ao popup que vai aparecer. Agora você precisará colocar outro código que irá chamar a função. Para colocar esse código, procure por outra tag chamada </body>.
Para finalizar...
