- Mensajes
- 2,408
- Puntuación de reacción
- 1
Buenas a todos!!
Hoy os voy a explicar como detectar en nuestras paginas si un visitante está, o no, usando AdBlock, y como mostrar un mensaje alternativo a la publicidad. :mola:
Antes de nada, copiamos y guardamos en un fichero tal que "adblock.js" el siguiente codigo que usaremos para detectar el uso de AdBlock en nuestra pagina:
Pastebin : [JavaScript] foro20.com - Pastebin.com
Ahora, en nuestra pagina, tenemos que poner todos los anuncios dentro de un div con un atributo class comun, como por ejemplo :
Dentro de dicho es div es conveniente que no haya mas contenido que el anuncio en si. El resto del contenido fuera de dicho div, y en caso de haber mas anuncios, se ponen dentro de otro div con el mismo class.
Hecho esto, lo unico que queda es llamar al archivo "adblock.js" y pasarle un par de parametros. En nuestra plantilla, antes del </head>, añadimos el siguiente codigo :
¡Y ya está! Cada vez que algun usuario con AdBlock activado entre a nuestra web verá el mensaje que hayamos indicado en la variable "msg".
DEMO : Bleed - Foro20
Me explico como un libro cerrado :roto2:, asi que ante cualquier duda dejad un comentario.
PD: En la demo tuve que poner anuncios de verdad para que los detecte al AdBlock. NO hacer click en ellos.
Hoy os voy a explicar como detectar en nuestras paginas si un visitante está, o no, usando AdBlock, y como mostrar un mensaje alternativo a la publicidad. :mola:
Antes de nada, copiamos y guardamos en un fichero tal que "adblock.js" el siguiente codigo que usaremos para detectar el uso de AdBlock en nuestra pagina:
Código:
function createXMLHttpRequest(){
try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) {}
try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {}
try { return new XMLHttpRequest(); } catch(e) {}
alert("XMLHttpRequest no soportado");
return null;
}
onload=function(){
if (document.getElementsByClassName == undefined) {
document.getElementsByClassName = function(className)
{
var hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)");
var allElements = document.getElementsByTagName("*");
var results = [];
var element;
for (var i = 0; (element = allElements[i]) != null; i++) {
var elementClass = element.className;
if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass))
results.push(element);
}
return results;
}
}
blocked = 0;
var ad_nodes = document.getElementsByClassName(ads);
for(i in ad_nodes){
if (ad_nodes[i].offsetHeight == 0){
blocked = 1;
ad_nodes[i].innerHTML = msg;
}
}
}Ahora, en nuestra pagina, tenemos que poner todos los anuncios dentro de un div con un atributo class comun, como por ejemplo :
Código:
<div class="div"> <!-- Hay que recordar lo que pongamos entre las comillas de class="" -->
<iframe src="http://track.adjal.com/BLABLABLABLA" scrolling="no" frameborder="0" marginheight="0" marginwidth="0" width="300" height="250"></iframe>
</div>Hecho esto, lo unico que queda es llamar al archivo "adblock.js" y pasarle un par de parametros. En nuestra plantilla, antes del </head>, añadimos el siguiente codigo :
Código:
<script type="text/javascript">
var ads = "div"; //Aqui ponemos el class que le hemos dado a todos los div con publi. En el caso de este ejemplo : div
var msg = '<img src="http://i.imgur.com/piJOXpq.jpg"/><br/><br/>Desactivalo, por favor ;)'; //Aqui el texto a mostrar en lugar de la publicidad</script>
<script src="adblocks.js" type="text/javascript"></script>¡Y ya está! Cada vez que algun usuario con AdBlock activado entre a nuestra web verá el mensaje que hayamos indicado en la variable "msg".
DEMO : Bleed - Foro20
Me explico como un libro cerrado :roto2:, asi que ante cualquier duda dejad un comentario.
PD: En la demo tuve que poner anuncios de verdad para que los detecte al AdBlock. NO hacer click en ellos.
Última edición:
