Tutorial: Alertar el uso de AdBlock

  • Autor Autor Cicklow
  • Fecha de inicio Fecha de inicio
Cicklow

Cicklow

Admin
Épsilon
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Suscripción a IA
Hola hoy aprenderán a bloquear al usuario y no permitirle ver el sitio hasta que deshabilite AdBlock (tambien podran mostrar el aviso y permitir ver el sitio).
noadblock.png


El código es fácil de implementar, entre el <head> y </head> colocamos:
Insertar CODE, HTML o PHP:
<style>
.black_overlay{
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index:1001;
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
}

.white_content {
    display: none;
    position: absolute;
    top: 20%;
    left: 25%;
    width: 50%;
    height: 50%;
    padding: 16px;
    border: 16px solid orange;
    background-color: [B]Enlace eliminado[/B] [/URL] ;
    z-index:1002;
    overflow: auto;
}
.white_content p {
    color: [B]Enlace eliminado[/B] [/URL] ;
    font-family: verdana;
}
</style>

Después de <body> colocamos:
Insertar CODE, HTML o PHP:
<img src="banner.gif?" width="1" height="1" id="XcVCCW">
<div id="light" class="white_content">
    <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'" style="text-decoration:none;position:absolute;top:0px;left:0px;display:none;"><img src="closeX.png"></a>
    <center>
        <img src="noadblock.png"><br/>
        <p>En este sitio no aceptamos el uso de AdBlock, tendrás que deshabilitarlo para ver el contenido.</p>
    </center>
</div>
<div id="fade" class="black_overlay"></div>
<script type="text/javascript">
      function cicklow_XcVCCW(){
        if(document.getElementById("XcVCCW")==null || document.getElementById("XcVCCW").offsetHeight<=0){
            document.getElementById('light').style.display='block';
            document.getElementById('fade').style.display='block';
            document.documentElement.style.overflow = 'hidden';  // firefox, chrome
                        document.body.scroll = "no"; // ie only
                        window.scrollTo(0, 0);
        }
      }
      window.onload=cicklow_XcVCCW;
</script>
El código lo que hace es ver si la imagen (banner.gif) fue sacada de nuestro código, eso significa que tiene AdBlock activado (u otro script anti ads). Si detectamos que lo tiene activado mostramos el lightbox.

Si queremos permitirle al usuario cerrar la ventana del lightbox, solo tenemos que cambiar esto:
Insertar CODE, HTML o PHP:
<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'" style="text-decoration:none;position:absolute;top:0px;left:0px;display:none;"><img src="closeX.png"></a>
por esto:
Insertar CODE, HTML o PHP:
<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'" style="text-decoration:none;position:absolute;top:0px;left:0px;"><img src="closeX.png"></a>

Descargar código | Ver ejemplo online

Saludos!

PD: sin links de adfly como vi en otro post XD jajajaja
PD: Se agrego un fix de parte de [MENTION=44787]zasudark[/MENTION] para que funcione bien con en algunos navegadores!
 
Última edición:
Excelente aporte :encouragement:
 
sos un kpoooooo :star2: gracias por compartir el tutorial :encouragement:
 
Gracias amigo

PD: el ejemplo no se ve
 
Gracias compa, funciona 100% 🙂

Dejo una imagen extra por si el usuario no sabe como detenerlo:

como_desactivar_adblock-4090b32.gif
 
excelente clicklow, seria genial que programes un plugin para wordpress. :encouragement:
 
Ok, gracias, después de escribirlo me lo imaginé, pero en el momento pensé que era un error
sisis se ve... si te muestra en blanco es que tenes deshabilitado adblock... ahora le meto contenido...
 
lol... Hola soy un contenido!!! 😕
 
muchas gracias, lo probare
 
y despues de esto el usuario va a hacer clic en los anuncios???? jajaja
 
no se... pero al menos lo deshabilita... por ahi le interesa algo del sitio y hace click...

un usuario que ya viene ravioso de ver publicidades y por eso se pone adblock, le mostras esto >>> cierra la pag y vuelve a google.... ja

igualmente se valora la intension y el esfuerzo 😉
 
Yo creo que hay que hacer sitios amigables, el exceso de publicidad genera este tipo de programas algo hemos estado haciendo mal...del aporte, excepcional
 
Gracias por tremendo aporte maestro #cicklow !
 
gracias! vamos a probarlo...
 
Gracias gracias ! Cicklow Presidente !😛8:
 
hay muchas formas de bloquear ese script y siempre lo habra. 😀

Buen tutorial.
 
Atrás
Arriba